Vue中的table中的tr无法正确渲染?

代码如下:

  <body>
    <div id="app">
      <table>
        <tr is="mycomponent"></tr>
        <tr>怎么上去了?</tr>
      </table>
    </div>
    <script>
      Vue.component('mycomponent',{
        template: '<tr>这也是一个自定义组件</tr>'
      })
      var app = new Vue({
        el: '#app',
        data: {
        }
      })
    </script>
  </body>

渲染结果如下:
图片描述

按道理说,tr是可以放在table中的吧

阅读 5.2k
3 个回答

目测是因为,你的 tr 直接包含了内容,你可以试下在 tr 内加一层 td,td 内放内容。

tr中不能直接放内容,你嵌套一个td试试

<body>

<div id="app">
  <table>
    <component is="mycomponent"></component>
    <tr>怎么上去了?</tr>
  </table>
</div>
<script>
  Vue.component('mycomponent',{
    template: '<tr>这也是一个自定义组件</tr>'
  })
  var app = new Vue({
    el: '#app',
    data: {
    }
  })
</script>

</body>

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题