Vue.js - 文章分类 - AtlasLapetos

Vue.js 实例

摘要：Vue.js 实例本章节为大家介绍几个 Vue.js 实例，通过实例练习来巩固学到的知识点。导航菜单实例导航菜单创建一个简单的导航菜单： <div id="main">  <!-- 为了阻止链接在点击时跳转，我们使用了 "prevent" 阅读全文

posted @ 2024-10-10 14:14 AtlasLapetos 阅读(5) 评论(0) 推荐(0) 编辑

Vue.js 响应接口

摘要：Vue.js 响应接口 Vue 可以添加数据动态响应接口。例如以下实例，我们通过使用 $watch 属性来实现数据的监听，$watch 必须添加在 Vue 实例之外才能实现正确的响应。实例中通过点击按钮计数器会加 1。setTimeout 设置 10 秒后计算器的值加上 20 。实例 <div 阅读全文

posted @ 2024-10-10 14:12 AtlasLapetos 阅读(8) 评论(0) 推荐(0) 编辑

Vue.js Ajax(vue-resource)

摘要：Vue.js Ajax(vue-resource) Vue 要实现异步加载需要使用到 vue-resource 库。 Vue.js 2.0 版本推荐使用 axios 来完成 ajax 请求。 <script src="https://cdn.staticfile.org/vue-resource/1 阅读全文

posted @ 2024-10-10 14:11 AtlasLapetos 阅读(9) 评论(0) 推荐(0) 编辑

Vue.js Ajax(axios)

摘要：Vue.js Ajax(axios) Vue.js 2.0 版本推荐使用 axios 来完成 ajax 请求。 Axios 是一个基于 Promise 的 HTTP 库，可以用在浏览器和 node.js 中。 Github开源地址： https://github.com/axios/axios 安装阅读全文

posted @ 2024-10-10 14:09 AtlasLapetos 阅读(6) 评论(0) 推荐(0) 编辑

Vue.js 混入

摘要：Vue.js 混入混入 (mixins)定义了一部分可复用的方法或者计算属性。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。来看一个简单的实例：实例 var vm = new Vue({ el: '#databinding', data: { 阅读全文

posted @ 2024-10-10 14:07 AtlasLapetos 阅读(5) 评论(0) 推荐(0) 编辑

Vue.js 过渡 & 动画

摘要：Vue.js 过渡 & 动画本章节我们主要讨论 Vue.js 的过渡效果与动画效果。过渡 Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果。 Vue 提供了内置的过渡封装组件，该组件用于包裹要实现过渡效果的组件。语法格式 <transition name = "name 阅读全文

posted @ 2024-10-10 14:04 AtlasLapetos 阅读(31) 评论(0) 推荐(0) 编辑

Vue.js 路由

摘要：Vue.js 路由本章节我们将为大家介绍 Vue.js 路由。 Vue.js 路由允许我们通过不同的 URL 访问不同的内容。通过 Vue.js 可以实现多视图的单页Web应用（single page web application，SPA）。 Vue.js 路由需要载入 vue-router 阅读全文

posted @ 2024-10-10 14:02 AtlasLapetos 阅读(2) 评论(0) 推荐(0) 编辑

Vue.js 自定义指令

摘要：Vue.js 自定义指令除了默认设置的核心指令( v-model 和 v-show ), Vue 也允许注册自定义指令。下面我们注册一个全局指令 v-focus, 该指令的功能是在页面加载时，元素获得焦点：实例 <div id="app"> <p>页面载入时，input 元素自动获取焦点：</ 阅读全文

posted @ 2024-10-10 13:59 AtlasLapetos 阅读(4) 评论(0) 推荐(0) 编辑

Vue.js 组件 - 自定义事件

摘要：Vue.js 组件 - 自定义事件父组件是使用 props 传递数据给子组件，但如果子组件要把数据传递回去，就需要使用自定义事件！我们可以使用 v-on 绑定自定义事件, 每个 Vue 实例都实现了事件接口(Events interface)，即：使用 $on(eventName) 监听事件阅读全文

posted @ 2024-10-10 13:58 AtlasLapetos 阅读(40) 评论(0) 推荐(0) 编辑

Vue.js 组件

摘要：Vue.js 组件组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树：注册一个全局组件语法格式如下： Vue.component(t 阅读全文

posted @ 2024-10-10 13:56 AtlasLapetos 阅读(2) 评论(0) 推荐(0) 编辑

Vue.js 表单

摘要：Vue.js 表单这节我们为大家介绍 Vue.js 表单上的应用。你可以用 v-model 指令在表单控件元素上创建双向数据绑定。 v-model 会根据控件类型自动选取正确的方法来更新元素。输入框实例中演示了 input 和 textarea 元素中使用 v-model 实现双向数据绑定：阅读全文

posted @ 2024-10-10 13:54 AtlasLapetos 阅读(4) 评论(0) 推荐(0) 编辑

Vue.js 事件处理器

摘要：Vue.js 事件处理器事件监听可以使用 v-on 指令： v-on <div id="app"> <button v-on:click="counter += 1">增加 1</button> <p>这个按钮被点击了 {{ counter }} 次。</p> </div> <script> ne 阅读全文

posted @ 2024-10-10 11:40 AtlasLapetos 阅读(30) 评论(0) 推荐(0) 编辑

Vue.js 样式绑定

摘要：Vue.js 样式绑定 Vue.js class class 与 style 是 HTML 元素的属性，用于设置元素的样式，我们可以用 v-bind 来设置样式属性。 Vue.js v-bind 在处理 class 和 style 时，专门增强了它。表达式的结果类型除了字符串之外，还可以是对象或数阅读全文

posted @ 2024-10-10 11:39 AtlasLapetos 阅读(12) 评论(0) 推荐(0) 编辑

Vue.js 监听属性

摘要：Vue.js 监听属性本章节，我们将为大家介绍 Vue.js 监听属性 watch，我们可以通过 watch 来响应数据的变化。以下实例通过使用 watch 实现计数器： <div id = "app"> <p style = "font-size:25px;">计数器: {{ counter 阅读全文

posted @ 2024-10-10 11:37 AtlasLapetos 阅读(7) 评论(0) 推荐(0) 编辑

Vue.js 计算属性

摘要：Vue.js 计算属性计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子：实例 1 <div id="app"> {{ message.split('').reverse().join('') }} </div> 尝试一下 » 实例 1 阅读全文

posted @ 2024-10-10 11:36 AtlasLapetos 阅读(4) 评论(0) 推荐(0) 编辑

Vue.js 循环语句

摘要：Vue.js 循环语句循环使用 v-for 指令。 v-for 指令需要以 site in sites 形式的特殊语法， sites 是源数据数组并且 site 是数组元素迭代的别名。 v-for 可以绑定数据到数组来渲染一个列表： v-for 指令 <div id="app"> <ol> <li 阅读全文

posted @ 2024-10-10 11:34 AtlasLapetos 阅读(2) 评论(0) 推荐(0) 编辑

Vue.js 条件语句

摘要：Vue.js 条件语句条件判断 v-if 条件判断使用 v-if 指令： v-if 指令在元素和 template 中使用 v-if 指令： <div id="app"> <p v-if="seen">现在你看到我了</p> <template v-if="ok"> <h1>菜鸟教程</h1> 阅读全文

posted @ 2024-10-10 11:32 AtlasLapetos 阅读(3) 评论(0) 推荐(0) 编辑

Vue.js 模板语法

摘要：Vue.js 模板语法 Vue.js 使用了基于 HTML 的模板语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。 Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。结合响应系统，在应用状态改变时， Vue 能够智能地计算出重新渲染组件的阅读全文

posted @ 2024-10-10 11:29 AtlasLapetos 阅读(9) 评论(0) 推荐(0) 编辑

Vue.js 起步

摘要：Vue.js 起步每个 Vue 应用都需要通过实例化 Vue 来实现。语法格式如下： var vm = new Vue({ // 选项 }) 接下来让我们通过实例来看下 Vue 构造器中需要哪些内容：实例 <div id="vue_det"> <h1>site : {{site}}</h1> 阅读全文

posted @ 2024-10-10 11:26 AtlasLapetos 阅读(3) 评论(0) 推荐(0) 编辑

Vue.js 目录结构

摘要：Vue.js 目录结构上一章节中我们使用了 npm 安装项目，我们在 IDE（Eclipse、Atom等）中打开该目录，结构如下所示：目录解析目录/文件说明 build 项目构建(webpack)相关代码 config 配置目录，包括端口号等。我们初学可以使用默认的。 node_modul 阅读全文

posted @ 2024-10-10 11:24 AtlasLapetos 阅读(6) 评论(0) 推荐(0) 编辑

文章分类 - JavaScript / Vue.js

搜索

常用链接

随笔分类

随笔档案

文章分类

阅读排行榜