Element 利用Tooltip提示框實現動態顯示文字提示

利用element的提示框來實現動態顯示迴圈的資料，效果圖如下：

這裡的四個項都是通過迴圈陣列來展示出來的，需要用Tooltip提示框將程式碼包裹起來就可以達到此效果，程式碼如下：
HTML:

<div v-for="(item,index) in choice" :key="index" class="equipmentname center2">
              <i class="el-icon-circle-close" style="margin:0 10px 0 10px;color:#009cde"  />
              <el-tooltip :disabled="item.length <= 10" class="item" placement="top">
                <div slot="content">{{ item }}</div>
                <div class="showname">{{ item }}</div>
              </el-tooltip>
            </div>

其中:disabled="item.length <= 10"這段程式碼是用於控制是否顯示提示框的，在這裡的用處是當迴圈出來的資料長度大於10時，就顯示提示框，不然就不顯示

JS:

data() {
    return {
      choice: [{
        date: '閉式單點快速壓力機'
      }, {
        date: '油漆噴塗廢氣處理'
      }, {
        date: '芯體半自動裝配機'

      }, {
        date: '水空自動扣壓幹試驗檢測線 (403-314)'

      }, {
        date: '剪下機器人'

      }, {
        date: '隔板清洗烘乾剪下裝置 (129-295)'

      }]
    }
  },

模擬資料如上。