vue.js 组件的重要选项

vue.js 组件的重要选项

1. data : {} //vue对象的数据
2. methods : {} //对象方法
3. watch ： {} //对象监听
   HTML 模板指令
   数据渲染层
   1.v-text <p v-text="?"></p> //绑定vue的数据对象
   2.v-html <p v-html="?"></p>
4. {{}} <p>{{?}}</p>

控制模块隐藏

1. v-if <p v-if="?"></p> //不渲染该元素
   5.v-show <p v-show="?"></p>

渲染循环

1. v-for <li v-for='a in n'><p v-text='a.?'></p></li>

绑定事件

1. v-on <button v-on:click="方法名"></button> //
   <button @click="方法名"></button> //简写
   绑定属性
2. v-bind <img v-bind:class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="?">
   <img :class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="?"> //简写