初识vue项目 vue-cli

安装vue-cli 

1.先安装node,安装node的时候会自动安装npm,可以通过 node -v  和 npm  -v 测试版本

2.全局安装node  这个去看官方文档就可以

3.运行 npm run dev  

注意事项：window系统不建议用gitbash 因为我就是用的 总是出问题，建议用powershell,也可以用vscode自带的命令行

npm如果安装比较慢，可以使用淘宝镜像cnpm ,会相对快些。

 下面我就总结一下我用到的vue的东西以及遇到的问题

 <button v-for="(button,i) in buttons"
          @click="addNewNode($event,i)"
          :key="button.buttonType"
          :data-type="button.buttonType"
          :style={left:button.left,top:button.top}>
          {{button.buttonName}}
        </button>

export default {
  data () {
    return {
      buttons: [
        {
          buttonName: '开始节点',
          left: '15px',
          top: '15px',
          buttonType: 'start'
        },
        {
          buttonName: '结束节点',
          left: '130px',
          top: '15px',
          buttonType: 'end'
        },
        {
          buttonName: '判断节点',
          left: '245px',
          top: '15px',
          buttonType: 'judge'
        },
        {
          buttonName: '操作节点',
          left: '360px',
          top: '15px',
          buttonType: 'operate'
        }
      ]
  }
}