随笔分类 -  Vue

Vue(十）
摘要：组件注册组件名在注册一个组件的时候，我们始终需要给它一个名字。比如在全局注册的时候我们已经看到了：Vue.component('my-component-name', { /* ... */ })该组件名就是 Vue.component 的第一个参数。1.组件名大小写定义组件名的方式有两种：使用ke 阅读全文
posted @ 2020-03-21 23:41 马中赤兔 阅读(214) 评论(0) 推荐(0)
Vue(九)
摘要：组件基础基本示例这里有一个 Vue 组件的示例：// 定义一个名为 button-counter 的新组件 Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button 阅读全文
posted @ 2020-03-21 00:57 马中赤兔 阅读(234) 评论(0) 推荐(0)
Vue(八)
摘要：表单输入绑定基础用法你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一 阅读全文
posted @ 2020-03-20 23:16 马中赤兔 阅读(214) 评论(0) 推荐(0)
Vue(七)
摘要：事件处理监听事件可以用 v-on 指令监听 DOM 事件，并在触发时运行一些 JavaScript 代码。示例：<div id="example-1"> <button v-on:click="counter += 1">Add 1</button> <p>The button above has 阅读全文
posted @ 2020-03-20 22:58 马中赤兔 阅读(165) 评论(0) 推荐(0)
Vue(六)
摘要：列表渲染用 v-for 把一个数组对应为一组元素我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组，而 item 则是被迭代的数组元素的别名。<ul id="example-1"> <li v- 阅读全文
posted @ 2020-03-20 22:42 马中赤兔 阅读(216) 评论(0) 推荐(0)
Vue(五)
摘要：条件渲染v-ifv-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。<h1 v-if="awesome">Vue is awesome!</h1>也可以用 v-else 添加一个“else 块”：<h1 v-if="awesome">Vue is a 阅读全文
posted @ 2020-03-20 22:11 马中赤兔 阅读(201) 评论(0) 推荐(0)
Vue(三)
摘要：计算属性和侦听器计算属性模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如：<div id="example"> {{ message.split('').reverse().join('') }} </div>所以，对于任何复杂逻辑，你都 阅读全文
posted @ 2020-03-20 20:10 马中赤兔 阅读(227) 评论(0) 推荐(0)
Vue（二）
摘要：插值1.文本数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值：<span>Message: {{ msg }}</span>通过使用 v-once 指令，你也能执行一次性地插值，当数据改变时，插值处的内容不会更新。但请留心这会影响到该节点上的其它数据绑定：<span v 阅读全文
posted @ 2020-03-20 19:52 马中赤兔 阅读(212) 评论(0) 推荐(0)
Vue（一）
摘要：创建一个Vue实例每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的：var vm = new Vue({ // 选项 })数据与方法当一个 Vue 实例被创建时，它将 data 对象中的所有的属性加入到 Vue 的响应式系统中。当这些属性的值发生改变时，视图将会产生“响应” 阅读全文
posted @ 2020-03-20 19:25 马中赤兔 阅读(186) 评论(0) 推荐(0)