Vue最早版本迁移到2.0

    xiaoxiao2021-12-14  23

    刚开始接触Vue的第一个项目就是把Vue最低版本的项目迁移到现在最新的版本2.0,好玩又有挑战。

    Vue中的知识点以及自2.0中的使用情况

    index key: 在v-for循环中 index key表示当前对象中的键值在2.0中均已废弃 2.0中的新语法

    <li v-for="(item, index) in items"/></li> <li v-for="(val, key, index) in items"/></li>

    当组件不需要渲染模板中的内容,而是渲染默认的内容时,可以使用组件的inline-template属性,组件将把它的内容当做模板,而不是当做分发内容,而且inline-template的优先级高于template。 模板的顶级元素是单个元素,即组件元素必须有一个根节点,否则会报错。 2.0中绑定动态属性不再支持class=”{{msg}}”,只能使用:class=”item”. $event原生事件对象,在2.0中已废弃。

    <button @click="handleClick($event)"/></button>

    v-ref:子组件的索引,可以通过父组件的$refs对象访问子组件。在2.0中已经废弃,改为ref属性

    <div id="parent"> <user-profile ref="profile"></user-profile> </div> var parent = new Vue({ el: '#parent' }) // 访问子组件 var child = parent.$refs.profile

    这个属性同样可用于元素上

    <p ref="p">hello</p>

    用于取代v-el指令。

    v-cloak:这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时,这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。

    [v-cloak] { display: none; } <div v-cloak> {{ message }} </div>
    转载请注明原文地址: https://ju.6miu.com/read-968573.html

    最新回复(0)