新闻项目-问题集合

问题1：识别不了vue-class-component问题

创建vue3项目时，添加typescript，一直报vue-class-component错误，找了好多方法，以下是解决我的问题方法

解决：

创建后，不要立即启动

一连套安装完，再启动

创建后
选vue3的默认配置即可
//终端
vue create 英语名字
遇到安装不了，用–save不行就–force，或加上–force
打开项目，打开终端，不启动项目
先添加typescript，全yes
安装vue-class-component
安装 @babel/plugin-proposal-decorators @babel/plugin-proposal-class-properties
在babel.config.js配置代码
以上OK，启动

//先添加typescript，全yes
vue add typescript

//安装vue-class-component
npm install --save vue vue-class-component

//安装 @babel/plugin-proposal-decorators @babel/plugin-proposal-class-properties
npm install --save-dev @babel/plugin-proposal-decorators @babel/plugin-proposal-class-properties

//在babel.config.js配置代码,保存
module.exports = {
  presets: ['@vue/cli-plugin-babel/preset'],
  plugins: [
    ['@babel/proposal-decorators', { legacy: true }],
    ['@babel/proposal-class-properties', { loose: true }]
  ]
}

//以上OK，启动
npm run serve

问题2 ：vue3配置路由导致出现该问题

报错出现：Cannot use ‘in’ operator to search for ‘catch’ in undefined

router_error

解决：

去掉箭头函数的大括号

component:()=>{import('./components/NewsDetail.vue')} 

改为

component:()=>import('./components/NewsDetail.vue')

问题3：vue3找不到模块’md-editor-v3’或其相应的类型声明。

安装之后识别不了

解决

在shims-vue.d.ts配置

续上
declare module 'md-editor-v3';
具体

/* eslint-disable */
declare module '*.vue' {
  import type { DefineComponent } from 'vue'
  const component: DefineComponent<{}, {}, any>
  export default component
}
declare module 'md-editor-v3';

得出个技巧：安装第三方插件，

在shims-vue.d.ts配置：declare module ‘安装插件的名称’;

问题4：属性“newsData”是私有的，只能在类”NewsList”中访问

在网上搜了方法，这个解决了

解决：将私有变成公有

private —> public

export default class NewsList extends Vue {
 private  newsData: any[] = []
}

改为

export default class NewsList extends Vue {
 public  newsData: any[] = []
}