vue 新手总结

Vue 常用命令

npm

  • npm init 生成一个package.json文件
  • 进入包含package.json的目录中,npm install下载该项目需要的库
install
  • npm install -g xxx 在全局下载xxx
  • npm install –save(-s) 表示本地安装,会被加至dependencies部分,即开发环境
  • npm install –save-dev(-D) 表示本地安装,会被加至devDependencies部分,即生产环境
调用webpack打包器
  • 打包:npm run build
  • 运行:npm run dev
  • 如果有webpack.config.js可以webpack打包

vue

vue-cli
3.0以前
  • 也可以init webpack vuedemo 创建项目,使用npm run dev启动
3.0以后
  • 先cd到要创建的目录中,vue create firstdemo npm run serve
  • vue ui 在UI界面创建,在浏览器启动npm run serve
  • 关于3.0vue的配置

node

  • node xxx(.js) 运行js

copy网上代码常用命令

  1. 先下载解压
  2. 然后在目录下使用cnpm install下载依赖
  3. 然后npm run dev运行

项目相关

  • 在script可以定义标签

    <template>
      <div id="app">
          //add-blog是addBlog中的name
          <add-blog></add-blog>
      </div>
    </template>
    
    <script>
    import AddBlog from './views/addBlog'
    export default {
      name: 'App',
      components: {
        AddBlog
      }
    }
    </script>
    
  • main.js是总入口,从这引入依赖可以有全局作用

语法相关

  • v-bind和v-model的区别

    • v-model用在表单控件上的,用于实现双向数据绑定,所以如果你用在除了表单控件以外的标签是没有任何效果的。
    • v-bind常用在css样式,数组,连接当中,是单向绑定
  • props

    a.vue:
    {{title}}
    props:{title}
    
    b.js
    <a :title="title"></a>
    

你可能感兴趣的:(前端)