先说第一个,在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的报错

从vue1迁移到vue2踩到的两个坑-LMLPHP

  组件里的模板代码是这样的

<template>
        <div>
            <router-link to="/">商品</router-link>
        </div>

        <div>
            <ul>
                <router-link to="/in">Intel</router-link>
            </ul>
        </div>
</template>

  问题出在template里面的两个div外面少了一层根元素,包裹上一层div就好了。

05-11 20:30