Vue基础知识总结复习（一）

一、 Vue简介

1.Vue的定位是前端框架，因为它提供了构建用户界面的一整套解决方案

• vue（核心库）
• vue-router（路由方案）
• vuex（状态管理方案）
• vue组件库（快速搭建页面UI效果的方案）

2.辅助vue项目开发的一系列工具

• vue-cli（npm全局包，一键生成工程化vue项目，基于webpack）
• vite（npm全局包：一键生成工程化的vue项目，新一代）
• vue-devtools（辅助调试）
• vetur（语法高亮）

3.vue的特性

• 数据驱动视图
• 双向数据绑定
• MVVM

二、vue基本使用步骤

1.导入vue.js的script脚本文件

<script src="./vue-3.1.0.js"></script>

2.页面中声明一个被vue控制的dom区域

<div id="app">{
  {username}}</div>

3.创建vm实例对象

<script>
    const vm = new Vue({
     
        el:'#app',
        data:{
     
            username: 'zs'
        }
    })
</script>

三、vue指令

1.v-bind属性绑定

为元素的属性绑定属性值，单向绑定

<input type="text" v-bind:placeholder="inputvalue