呀呼!呀呼! 2022-05-09 21:01 采纳率: 77.3%
浏览 106
已结题

为什么我访问Vue里面的Data中的tableData下的变量id的控制台输出结果是undefined,但是我访问控制台输出tableData结果发现tableData里面的id是有数据的

问题遇到的现象:为什么我访问Vue里面的Data中的tableData下的变量id的控制台输出结果是undefined,但是我访问控制台输出tableData结果发现tableData里面的id是有数据的;
访问方式:
new Vue({
el:"#app",
mounted(){
var _this=this;
axios.get("http://localhost:8080/ElementDemo/selectAllServlet").then(function (resp) {
console.log(_this.tableData);//有数据
console.log(_this.tableData.id);//undefined

发生背景 :itheima javaweb课程最后面利用Element、vue、axios的综合案例之删除品牌

问题相关代码:PS:(为了突出重点,只贴出关键部分)

<script>
    new Vue({
        el:"#app",
         mounted(){
             var _this=this;
             axios.get("http://localhost:8080/ElementDemo/selectAllServlet").then(function (resp) {
                      _this.tableData =resp.data;
                        console.log(_this.tableData);//有数据
                        console.log(_this.tableData.id);//undefined
         })
         },
        data() {
            return {
                tableData: [{
                    brandName: '',
                    companyName: '',
                    ordered: '',
                    status:'',
                    id:''
                }, {
                    brandName: '',
                    companyName: '',
                    ordered: '',
                    status:'',
                    id:''
                }, {
                    brandName: '',
                    companyName: '',
                    ordered: '',
                    status:'',
                    id:''
                }, {
                    brandName: '',
                    companyName: '',
                    ordered: '',
                    status:'',
                    id:''
                }, {
                    brandName: '',
                    companyName: '',
                    ordered: '',
                    status: '',
                    id: ''
                }]
            }
        }
    })

  <template>
        <el-table
                :data="tableData"
                style="width: 100%"
                :row-class-name="tableRowClassName"
            @selection-change="handleSelectionChange">
            <el-table-column
                    type="selection"
                    width="55">
            </el-table-column>
            <el-table-column
                    type="index"
                    width="50">
            </el-table-column>
            <el-table-column
                    prop="brandName"
                    label="品牌名称"
                    align="center"
                   >
            </el-table-column>
            <el-table-column
                    prop="companyName"
                    label="企业名称"
                    align="center"
                   >
            </el-table-column>
            <el-table-column
                    prop="ordered"
                    label="订单量"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="当前状态"
                    align="center"
                    translate="translateStatus">
            </el-table-column>
            <el-table-column
                    prop="id"
                    label="id"
                    align="center"
            >
            </el-table-column>
            <el-table-column
                    label="操作"
                    align="center">
                <el-row>
                <el-button type="primary"  >修改</el-button>
                <el-button type="danger" @click="deleteBrandById">删除</el-button>
                </el-row>
            </el-table-column>
        </el-table>
    </template>

运行结果:

img


可以看出我通过console.log(_this.tableData);访问tableData是有数据的,而且里面的id变量也是有数据的;

img


可以看出我通过console.log(_this.tableData.id);访问tableData.id他给我输出一个undefined;

报错内容:目前无报错,不过因为他给我一个undefined传到我的Servlet里面导致了我空指针异常 ;

我的解答思路和尝试过的方法 :
搞了很久之后我怀疑是我的访问方式有问题,但是我在网上搜不到;
我想要达到的结果 :
获取正确的id数据,而不是undefined;

  • 写回答

1条回答 默认 最新

  • Heerey525 前端领域新星创作者 2022-05-09 21:31
    关注

    console.log(_this.tableData.id);//undefined
    是由于 _this.tableData 是一个数组,当然id是undefined,tableData里面的对象才有id,如tableData中第一个对象console.log(_this.tableData[0].id);

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 5月17日
  • 已采纳回答 5月9日
  • 创建了问题 5月9日

悬赏问题

  • ¥15 有两个非常“自以为是”烦人的问题急期待大家解决!
  • ¥30 STM32 INMP441无法读取数据
  • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
  • ¥15 用visualstudio2022创建vue项目后无法启动
  • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
  • ¥500 把面具戴到人脸上,请大家贡献智慧
  • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。
  • ¥15 各位 帮我看看如何写代码,打出来的图形要和如下图呈现的一样,急
  • ¥30 c#打开word开启修订并实时显示批注
  • ¥15 如何解决ldsc的这条报错/index error