先说第一个,在vue1中用v-for的时候,习惯性用$index和$key来取键。今天迁移到vue2之前,也知道vue2里不能这样用了,结果还是出问题了,
数据渲染不出来。
<li v-for="(key, price) in intel.storage" @click="changePrice(key, price)" :class="{active: intel.price == price}"> <span>{{key}}</span> </li>
因为是用vuex管理数据,排查问题多花了一些时间。问题出在了v-for里键值对的顺序了,vue2要求括号里第一个参数是值,第二个是键。
再说第二个问题,和vue2无关,是自己迁移的时候不小心多删了代码,先看一下chrome的报错
组件里的模板代码是这样的
<template> <div> <router-link to="/">商品</router-link> </div> <div> <ul> <router-link to="/in">Intel</router-link> </ul> </div> </template>
问题出在template里面的两个div外面少了一层根元素,包裹上一层div就好了。