search

Home  >  Q&A  >  body text

javascript - element ui

<el-table :data="tableData">
  <el-table-column prop="name"></el-table-column>
</el-table>

tableData [{
  name: 'irene'
}]

nameVariable is a variable, value is equal to 'name', when I change the column to <el-table-column :prop="nameVariable"></el-table-column>, the data is not displayed Yes, why is this?

PHP中文网PHP中文网2857 days ago518

reply all(3)I'll reply

  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-19 10:39:51

    The principle of this component is like this
    : data is equivalent to a variable
    prop is equivalent to the key of the variable
    prop must be: the key of the data variable
    So your problem should be a calling problem, prop cannot call other variables

    reply
    0
  • 怪我咯

    怪我咯2017-05-19 10:39:51

    For this question, please take a look at the demo on the official website
    <el-table :data="tableData" style="width: 100%">

    <el-table-column prop="date" label="日期" width="180"></el-table-column>

    </el-table>
    export default {

        data() {
            return {
                tableData: [{
                    date: '2016-05-02',
                    }]
                    }
                }
              }
    官网demo提示,prop后面跟的数据是colum中的key值,而且没有使用v-bind:prop。
    你可以把列改为<el-table-column prop="nameVariable"></el-table-column>
    然后对应的data数据中,将列的key值也改成nameVariable。那么数据就可以显示了

    reply
    0
  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-19 10:39:51

    If you changed it at the top, you should change it at the bottom too

    reply
    0
  • Cancelreply