VUE基本操作==>选项

本文从五个知识点写vue选项

1. propsData 用于扩展自定义标签的时候构造器传值

2. computed 格式化数据

3. methods 系列知识

4. Watch 选项 监控数据

5. mixins 选项 混入

6. extends 选项 扩展

1.propsData 用于扩展自定义标签的时候构造器传值

propsData 用于扩展自定义标签的时候构造器传值,比如说，我自定义的标签，里面有某些字段是希望通过 实例化的时候传入，但我又不想使用 构造器data，这个时候就需要 propsData了

示例：

    <zhangzq></zhangzq>

    <script>
        // 实例化对象
        var zhangzq = Vue.extend({
            template:`
                <p>{
  {message}}<==>{
  {info}}</p>
            `,
            data: function(){
                return {
                    message:"张子强"
                }
            },
            // 属性
            props:['info']
        })

        // 挂载
        new zhangzq({
            propsData:{
                info:"你好哦"
            }
        }).$mount("zhangzq");

2.computed 格式化数据

computed 格式化数据，这个在 v-for 里面就写过，很简单，就是格式化数据的，比如说，我想输出 $12元  这样的格式，再比如说，我需要把数据排序，等等...

示例：

    <div id="app" >
        <p>价格是：{
  {price}}</p>
        <p><button @click="add" >add</button></p>
        <p>format后的价钱是：{
  {priceFormat}}</p>
        <hr>
        <p>数据排序</p>
        <ul>
            <li v-for="(item ,index) in dataSort" >{
  {item.title}}  --  {
  {item.time}}</li>
        </ul>
    </div>

    <script>
        // compured , methods , 都是选项
        var app = new Vue({