美文网首页
Vue.extend与Vue.component的区别

Vue.extend与Vue.component的区别

作者: 简单tao的简单 | 来源:发表于2024-01-22 09:11 被阅读0次

Vue.extend

<template>
  <div>
    <div id="mount-point"></div>
  </div>
</template>
<script>
import Vue from 'vue'
export default {
  data() {
    return {
      
    }
  },
  mounted() {
    var Profile = Vue.extend({
      template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
      data: function () {
        return {
          firstName: 'Walter',
          lastName: 'White',
          alias: 'Heisenberg'
        }
      }
    })
    // 创建 Profile 实例,并挂载到一个元素上。
    new Profile().$mount('#mount-point')
  },
}
</script>

在什么情况下使用Vue.extend

  • 组件模板都是事先就创建好的,要是我想从接口动态渲染组件怎么办?
  • 有内容都是在 #app 下渲染,注册组件都是在当前位置渲染。如果我要实现一个类似于 window.alert() 提示组件要求像调用 JS 函数一样调用它,该怎么办?
  • 全局组件

相关文章

网友评论

      本文标题:Vue.extend与Vue.component的区别

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