
vue.js学习
床懒
每日挤一小时下床觅食
展开
-
2.v-for
v-for可遍历数组或对象<div id="two"> <div v-for="(item,index) in items">{{index}} : {{item}}</div> </div>new Vue({ el:"#two", data:{ parentMessage: 'Parent',原创 2018-06-15 17:14:16 · 143 阅读 · 0 评论 -
11.子→父通信
<body> <div id="sf"> <bod></bod> </div> //父 Vue.component('bod',{ template:` <div> <show v-on:showing="showing=true">&l原创 2018-08-06 19:43:43 · 174 阅读 · 0 评论 -
12.平行组件通信
<div id="parallel"> <first></first> <second></second> </div> var Event = new Vue();//事件调度器,将第一个组件里的first_say与第二个组件里的first_say绑定 Vue.component('first',原创 2018-08-09 19:50:15 · 316 阅读 · 0 评论 -
10.外→内通信
在标签设置属性,能使其产生一些交互效果 <div id="test"> <alert msg="not hot"></alert><br> <alerts msg="hot"></alerts><br> <name use原创 2018-07-21 00:03:26 · 125 阅读 · 0 评论 -
9.组件的配置
<style> .adder{ background: red; } </style><div id="jiayi"> <adder></adder> </div>Vue.component('adder',{ template:'&a原创 2018-07-11 21:23:18 · 165 阅读 · 0 评论 -
8.局部-全局组件
<div id="t627"> <linking></linking> <btn></btn> </div> <div id="t6272"> <sogou></sogou> </d原创 2018-06-27 23:08:13 · 156 阅读 · 0 评论 -
7.计算属性computed
<div id="calcu"> <table border="1px solid black" style="text-align: center" align="center"> <tr> <th>水果</th> &原创 2018-06-26 23:42:59 · 166 阅读 · 0 评论 -
6.控制流
<div id="bd"> <div v-if="player=='male'"> 你好帅哥。 </div> <div v-else-if="player=='female'"> 美女你好。 </div> <div v-else="原创 2018-06-26 11:54:14 · 157 阅读 · 0 评论 -
5.v-model
<div id="test1"> <input type="text" v-model.lazy="apple"> <pre>{{apple}}</pre> <input type="text" v-model.trim="peach">原创 2018-06-18 02:57:42 · 187 阅读 · 0 评论 -
4.v-on
v-on 绑定事件原创 2018-06-17 13:58:00 · 130 阅读 · 0 评论 -
3.v-bind
v-bind是用来绑定标签与数据的指令原创 2018-06-12 01:07:37 · 144 阅读 · 0 评论 -
13.过滤器filter
Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。可用于对数据在显示给用户前进行最后一步处理。 <!-- 在双花括号中 --> {{ message | capitalize }} <!-- 在 `v-bind` 中 --> <div v-bind:i...转载 2018-08-11 16:54:41 · 209 阅读 · 0 评论