美文网首页
Vue构造选项

Vue构造选项

作者: 卢卢2020 | 来源:发表于2021-02-26 00:06 被阅读0次

    什么是vue实例


    ①const vm = new Vue(options)  

    ②new Vue(options)

    以上两种方法就是vue实例,第一种方法根据你得到的options实例得出一个对象,这个对象我们把它命名为vm

    options里面有什么


    红色:好学 必学; 黄色:高级属性  ;  紫色:比较特殊,重点讲  蓝色:可学可不学  灰色:不常用 自己看文档

    Vue入门属性


    1.el——挂载点 (可以用$mount代替)

    两种方法++++上代码:

    ①:new Vue({
            el:"#app", //这个名字看index文件里面的div的id名

            render(h){ 

                 return h(demo) //demo为需要引入的文件名
            }
    })

    ②:new Vue({
            render:h=>h(demo) 
    }).$mount("#frank")

    2.data——内部数据(可以是一个对象  也可以是一个函数)

        支持函数和对象,优先用函数    

    ①为变量是写法:

    data:{

        n:0

    }

    ②为函数时写法 

    data(){  //data() 为data:function(){}缩写

        return{
            n:0
        }
    }

    PS:组件里面的data必须是函数 (为了避免两个data公用一个函数的问题 如果data写成函数每次调用data得到一个全新的data)

    3.methods ——方法

          事件处理函数或者普通含数 

    如下图 methods有一个bug 每次渲染都会执行——就算执行是毫无意义的

    4.components

    使用Vue组件,注意大小写

    也就是说 你是入口那么你就是实例  你是被人家引用的 那么你就叫组件

    5.四个钩子

    created ——实例出现在内存中

    mounted ——实例出现在页面中

    updated ——实例更新了

    destoryed ——实例消亡了

    消失比较复杂 用到了点击出现的例子

    5.props ——外部属性

    相关文章

      网友评论

          本文标题:Vue构造选项

          本文链接:https://www.haomeiwen.com/subject/vufufltx.html