在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue中使用組件渲染tbody，結(jié)果tbody和table平級(jí)???

vue中使用組件渲染tbody，結(jié)果tbody和table平級(jí)???

代碼如下

html

<div id="app">
          <table>
              <thead>
                  <tr>
                      <th>表單動(dòng)畫</th>
                      <th>姓名</th>
                      <th>操作</th>
                  </tr>
              </thead>
              <trs :parent-data="list"></trs> 
          </table>
    </div>  
組件模板

<template id="tmp">
        <tbody>
            <tr v-for="(item, index) in msg" :key="item.id">
                <td>{{index}}</td>
                <td>{{item.id}}</td>
                <td>
                    <a href="#" @click.prevent="del(item.id)"></a>
                </td>
            </tr>
        </tbody>
    </template>
 var trs = {
            template: '#tmp'
            }

圖片描述

怎么解決啊，各種問，各種看，依舊不行，使用過渡動(dòng)畫的方式我只到使用

 <table is="transition"></table>  // 使用 is

使用 is 沒試出來，有沒有其他解決辦法啊

回答
編輯回答
玩控

圖片描述

2017年3月15日 13:21
編輯回答
糖果果

沒想到今日才算真正地解決

兩種理解方式

  • 字符串模板：使用了template，因而基于vue-cli搭建的項(xiàng)目，每個(gè)組件都是一個(gè)，因而可以忽略名稱大小，以及這類特殊問題，正常使用即可
  • 非字符串模板： 這里指直接在html中使用，當(dāng)前問題便是這一類
//組件

<template id="tmp">
        <tbody>
            <tr v-for="(item, index) in msg" :key="item.id">
                <td>{{index}}</td>
                <td>{{item.id}}</td>
                <td>
                    1234567
                </td>
            </tr>
        </tbody>
    </template>
    
 //父組件中使用
<table>
              <thead>
                  <tr>
                      <th>表單動(dòng)畫</th>
                      <th>姓名</th>
                      <th>操作</th>
                  </tr>
              </thead>
              <tbody is="trs"></tbody>
          </table>
上面看起來使用了tbody兩次，但是在頁面渲染時(shí)卻只有一個(gè)，因而使用is是可以解決的

若是使用 vue-cli，則直接當(dāng)成正常組件使用即可，這些特殊情況都會(huì)在字符串模板中處理好

2017年9月26日 04:39