使用v-for出现"TypeError:Cannot read property 'xxx' of undefined"

Question

“{{period.period_name}}”去掉后，“{{period.this_period_start}}”就报错了。
period.period_name、period.this_period_start、period.this_period_end、period.same_period_start、period.same_period_end都获取不到。

<div class="period-list-box" v-for="{index,period} in period_list">
            <div class="period-list-item">
                <div class="period-content">
                    <div class="period-name">{{period.period_name}}</div>
                    <div class="period-time">
                        本期：{{period.this_period_start}}~{{period.this_period_end}} 同期：{{period.same_period_start}}~{{period.same_period_end}}
                    </div>
                </div>
                <div class="delete-period">
                    <img src="#">
                </div>
            </div>
        </div>

period_list输出每个字段都添加了的

data.forEach((item) => {
                                    this.period_list.push({
                                        period_id: item.period_id,
                                        period_name: item.period_name,
                                        this_period_start: item.this_period_start,
                                        this_period_end: item.this_period_end,
                                        same_period_start: item.same_period_start,
                                        same_period_end: item.same_period_end,
                                    })
                                })

Answer 1

楼上回答的是对的，另外，如果你的list是从后台请求回来的数据的话，最好在外层包裹一个<div v-if="period_list"></div>,确保数据请求回来再渲染dom，这样百分百不会报错了

Answer 2

...

{index, period} -->(period, index)

写反了，而且是圆括号，别的错还有没有就暂时不知道了