vue的is和v-bind:is怎么用

首先我们要明白v-bind的意义:

  <component v-bind:is="current"></component>
如果出现了v-bind那么加载在这个组件的时候,会去创建的vue实例对象的data里找值:

  var vm = new Vue({ el: '#app', data: function(){ return { current: 'sub' } } })
如图所示,找到sub,现在就等同于用sub替换了current:

  <component is="sub"></component>
注意,这里:is变成了is,因为我们已经成功的从vm里面取到了current,剩下的事情就是去找到这个叫做sub的component:

  Vue.component('sub',{ ... })
最后这个标签代表的内容就变成了:<sub></sub>
对于:is=‘current’来说,总的流程如下:

去vue实例的data里找到current对应的值
用这个值再去所有的component里找到对应的component
对于is=‘current’来说,总的流程如下:

直接用current去所有的component里找到对应的component

 

posted @ 2020-04-23 10:26  努力~努力再努力~  阅读(3173)  评论(1编辑  收藏  举报