Добавьте другой тип столбца с помощью Vue и пользовательского интерфейса элемента

Добавьте другой тип столбца с помощью Vue и пользовательского интерфейса элемента

20.10.2019 06:14:06 Просмотров 72 Источник

Я ищу пример или способ создания таблицы, в которой каждая строка имеет разные столбцы.

Я прочитал документацию по таблице пользовательского интерфейса Element, но не смог найти такую настройку.

Пожалуйста, обратитесь к изображению здесь. Я хочу достичь такого рода функциональности, если у кого-то есть реализация в прошлом или может дать мне некоторые предложения.

enter image description here

jquery vue.js element-ui
У вопроса есть решение - Посмотреть?

Ответы - Добавьте другой тип столбца с помощью Vue и пользовательского интерфейса элемента / Add different type of column using Vue and element ui

Является ответом!
BTL

20.10.2019 07:19:20

Вы должны использовать <template slot-scope="scope">

Проверить этот пример для элемента пользовательского интерфейса таблице : https://element.eleme.io/#/en-US/component/table#custom-column-template

<template>
  <el-table
    :data="tableData"
    style="width: 100%">
    <el-table-column
      label="Operations">
      <template slot-scope="scope">
        <el-button v-if="scope.row.date === '2016'">
          Edit
        </el-button>
        <el-select v-if="scope.row.date === '2017'">
          <el-option
            v-for="item in 3"
            :key="item"
            :label="item"
            :value="item">
          </el-option>
        </el-select>
      </template>
    </el-table-column>
  </el-table>
</template>

И если вы хотите, я сделал кодовое перо : https://codepen.io/Andugal/pen/JjjbBvE

Источник

Другие вопросы

Ответы на ваши вопросы

Закрыть X