javascript - vue组件注册使用问题?求解

 老翅几回寒_332 发布于 2022-11-09 12:28

使用vue组件的时候,我尝试用2中写法去写,写法如下,第一种方法显示正常,但是为什么用第二种写法的父元素却未显示?求大神解答

html代码

第一种

var partList = Vue.extend({
         template: '
  • javascript

     Languary 262016年12月5日

    最近做一个嵌在APP中的网页活动,接触到好些新技术(支付宝WAP支付场景,微信WAP支付场景、二维码支付场景,网页唤醒APP)。前面的那位同学,你说什么,你都会啊,那是我项目经验少咯 :)今天刚把网页唤醒APP的功能做好,就来写一写

  • ', data: function () { return { firstName: 'Walter', lastName: 'White', alias: 'Heisenberg' } } }) Vue.component("my-list",partList) var list = new Vue({ el: '#part' });

    效果图

    调试栏

    显示正常,ul标签存在

    第二种

    var list = new Vue({
        el: '#part',
        template: "", 
        components: { 
            "my-list": { 
             template: '
  • javascript

     Languary 262016年12月5日

    最近做一个嵌在APP中的网页活动,接触到好些新技术(支付宝WAP支付场景,微信WAP支付场景、二维码支付场景,网页唤醒APP)。前面的那位同学,你说什么,你都会啊,那是我项目经验少咯 :)今天刚把网页唤醒APP的功能做好,就来写一写

  • ' } });

    效果图

    调试栏

    显示错误,ul标签不存在

    1 个回答
    • 这一点确实比较奇怪 -- new Vue({el: '#app'}) 等价于 new Vue({}).$mount('#app'),而文档中提到:

      // 创建并挂载到 #app (会替换 #app)
      new MyComponent().$mount('#app')

      注意:“替换”!所以在你的第二个例子中,ul#part 其实被替换成了 <my-list> 也就是一个 <li>.

      而为啥第一个例子正常运行呢?因为第一个例子中你没有指定template,所以ul#part的HTML会被当作模版,而此时ul#part会被保留。如果你非要问为什么会被保留,只能说u大就是这样设计的。。。

      2022-11-12 01:41 回答
    撰写答案
    今天,你开发时遇到什么问题呢?
    立即提问
    热门标签
    PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
    Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有