vue的router如何导入组建？

Question

import ListCard from '../components/ListCard.vue'
import Cooker from '../components/Cooker.vue'
const  routers = [
    {
        path: '/',
        redirect: '/list',
    },
    {
        path: '/list',
        name: '数据列表',
        component: ListCard
    },
    {
        path: '/grasp',
        name: 'grasp',
        component: Cooker
    }

]

如图，这种方式，根本，不能做到同步数据与界面。
v-for 永远也刷新不了界面。尽管listss已经发生了改变。

 {{listss}}
        <div v-for="(pp, index) in listss" :key="index" class="sonbi" @dblclick="showDetail(pp)">
            <h2 class="ttl">
            {{pp.name}}
            </h2>
        </div>

这样写也不行：

const  routers = [
    {
        path: '/',
        redirect: '/list',
    },
    {
        path: '/list',
        name: '数据列表',
        component: () => import('@/components/ListCard.vue')
    },
    {
        path: '/grasp',
        name: 'grasp',
        component: () => import('@/components/Cooker.vue')
    }

]

export default routers

package.json. 用vue-cli初始化的

{
  "name": "generation-frontend",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "vue": "^2.5.17"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.2.0",
    "@vue/cli-plugin-eslint": "^3.2.0",
    "@vue/cli-service": "^3.2.0",
    "axios": "^0.18.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0-0",
    "iview": "^3.1.5",
    "query-string": "^6.2.0",
    "vue-router": "^3.0.2",
    "vue-template-compiler": "^2.5.17"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

Answer 1

我想你真正的问题应该是数据更新了视图没有更新吧。

Answer 2

router数组没有放在data里，肯定不是响应式的了，而且你在组件里使用router数组这个需求是什么？写死在router里的数据为什么要改变，这些都需要描述清楚

Answer 3

已解决。原来是 一个Modal的组建，跟这个div的位置同级了。导致的问题。