将返回的 json 中的内容解析为 el-dropdown-item答案

【问题标题】：parse contents from returned json to el-dropdown-item将返回的 json 中的内容解析为 el-dropdown-item
【发布时间】：2019-12-20 13:33:57
【问题描述】：

需要 el-dropdown 帮助以从快速解析的 json 中解析内容。

试过https://medium.com/html-all-the-things/hatt-vue-js-2-9b34557f0305这个教程，似乎没有从JSON解析内容的选项。

/*dropdown in index.vue, simplified*/
<el-dropdown>
  <el-button type="primary" trigger="click">dropList<i class="el-icon-arrow-down el-icon--right"></i>
  </el-button>
  <el-dropdown-menu>
    <el-dropdown-item command="someCommandWhichIsNotYetWritten">{{getList}}</el-dropdown-item>
  </el-dropdown-menu>
</el-dropdown>

/*script*/
export default {
  data() {
    return {
    getList: []
   }
}

/*The returning JSON is as follows*/

result {
  metaData: [ { name: 'NAME' } ],
  rows: [
    { NAME: '131' },
    { NAME: '132' },
    { NAME: '138' },
    { NAME: '139' },
    { NAME: '142' },
    { NAME: '193' },
    { NAME: '194' },
    { NAME: '235' },
    { NAME: '241' },
    { NAME: '44' }
  ]
}

PS：我知道这些注释行并非在所有情况下都有效。只是为了澄清我的所作所为而添加。

在这段代码中，我看到了 JSON 的所有内容，但我想单独列出那些连接到命令（a href）或其他东西的数字（NAME）。 PS：据我了解el-dropdown command="someCommand" 与<a href> 类似。

【问题讨论】：

标签： json vue.js nuxt.js element-ui

【解决方案1】：

加载数据后，您需要将其分配给本地组件数据，f。 e: this.getList = result.rows
必须在循环中创建下拉项（在 vue 文档中阅读有关 v-for 指令的更多信息）： <el-dropdown-item @command="todo(item)" v-for="item in getList" :key="item. NAME">{{item.NAME}}</el-dropdown-item>
要处理上述代码中的命令，您必须创建名为 todo 的本地方法。

【讨论】：