常用包

  • @vue/cli全局安装脚手架

初始化项目

  • vue create web-community-client创建项目(Manually select features->Choose Vue version,Babel, Router,Vuex,CSS Pre-processors,Linter / Formatter->n->Sass/SCSS (with dart-sass)->ESLint + Standard config->接下来使用默认即可

组件通信

父子组件通信中常用三种方法

1
<child-component :property="data"></child-component>
  • 在父组件中,使用component引用子组件,然后使用props属性:
  • 使用Vuex状态管理进行父子组件通信,定义store.js,并定义state,在state中定义传递的属性比如叫childProperty。然后,在子组件中,使用store.state.childProperty进行使用。
  • 使用router中的Params进行传参(即路径传参)
    • 设置路由/child/:id,当访问到/child/1元素的时候,在子组件中,使用this.$route.params.id的方式进行使用