Vue
vue学习之路
weixin_45963440
这个作者很懒,什么都没留下…
展开
-
7.列表渲染
7.1用 v-for 把一个数组对应为一组元素<!-- 我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令需要 使用 item in items 形式的特殊语法,其中 items 是源数据数组,而 item 则是被迭代的数组元素的别名。 --> <ul id="app1"> <li v-for="item in items">{{item.message}}&原创 2020-11-08 20:01:27 · 104 阅读 · 0 评论 -
6.条件渲染
6.条件渲染6.1v-if6.1.1v-if&v-else示例1<div id="app1"> <!-- v-if为true,则显示hello world! --> <p v-if="hello">hello world!</p> <!-- v-if为false,显示oh,no! --> <p v-else>oh,no!<原创 2020-11-07 23:13:15 · 93 阅读 · 0 评论 -
5.Class 与 Style 绑定
5.Class与Style绑定5.1绑定HTML的class5.1.1对象语法<!-- 普通实例 --> <div id="app1" class="static" v-bind:class="{active:isActive , 'text-danger':isDanger, clsName:nameVal}"> </div> <script> var vm1 = new Vue({ el原创 2020-11-07 19:57:42 · 73 阅读 · 0 评论 -
4.计算属性和侦听器
4.1计算属性4.1.1基础例子<div id="app"> <p>before computed: {{message}}</p> <p>after computed: "{{reverseMsg}}"</p> </div> <script> var vm = new Vue({ el:'#app', data:原创 2020-11-05 00:52:28 · 130 阅读 · 0 评论 -
3.模板语法
3.1插值3.1.1文本:数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值:例如: Message: {{ msg }}3.1.2原始HTML双大括号会将数据解释为普通文本,而非 HTML 代码。为了输出真正的 HTML,你需要使用 v-html例如:①直接使用双大括号渲染<div id="app">{{message}}</div><script> new Vue({ el: "#app",原创 2020-11-04 20:34:05 · 165 阅读 · 0 评论 -
2.Vue实例
<div id="app"></div> <div id="app1"></div> <script> var obj = {a:1}; var vm = new Vue({ el:'#app', data:obj }) console.log(vm.a);//打印1 console.log(vm.a ==原创 2020-11-04 20:20:33 · 106 阅读 · 0 评论 -
1.Vue介绍
Vue学习初步认知原创 2020-11-04 19:40:20 · 128 阅读 · 0 评论