vue、vuex、vue-router初学导航配合elementui及vscode快捷键

初学Vue、Vuex、Vue-Router以及Element UI时，可以使用VSCode的一些快捷键来提高效率。以下是一些实用的快捷键和代码示例：

1. 安装Vue CLI：

npm install -g @vue/cli

2. 创建一个新的Vue项目：

vue create my-project

3. 安装Vuex：

npm install vuex --save

4. 安装Vue-Router：

npm install vue-router --save

5. 安装Element UI：

npm i element-ui -S

6. 在Vue组件中使用Element UI组件：

<template>
  <el-button @click="handleClick">点击我</el-button>
</template>
 
<script>
import { Button } from 'element-ui';
 
export default {
  components: {
    [Button.name]: Button,
  },
  methods: {
    handleClick() {
      alert('按钮被点击');
    },
  },
};
</script>

快捷键：

• kb(editor.action.insertSnippet): 插入Vue模板或者Element UI组件；
• kb(editor.action.formatDocument): 格式化代码；
• kb(editor.action.quickOutline): 显示大纲，方便查找方法和属性；
• kb(editor.action.goToDeclaration): 跳转到组件定义；
• kb(editor.action.referenceSearch.trigger): 查找所有引用。

记住，快捷键可能会根据你的VSCode设置和你所使用的键盘架构而有所不同。