Vue概念

本来想花100天的时间做一个前后端分离的项目的，奈何前端框架等相关实在是不会。打算还是先打基础，从0开始学。

Vue是什么？

      简单小巧的核心，渐进式技术栈，足以应付任何规模的应用。

     所谓渐进式，就是一步一步、有阶段地来使用Vue.js，不必一开始就使用所有东西。

Vue常见的功能： 

解耦视图与数据可复用的组件前端路由状态管理虚拟DOM(Virtual DOM)

MVVM模式 ：

       MVVM( Model - View - View Model )模式，但视图层发生变化时，会自动更新到视图模型，反之亦然。View 和 ViewModel 之间通过双向绑定建立联系。

     Vue.js通过MVVM的模式将拆分为视图和数据两部分，并将其分离。

创建component组件 ：

<template> <div id="show"> <input type="text" v-model="name" placeholder="你的名字"/> <h1>你好, {{name}}</h1> </div> </template> <script> export default { name: "Hello", data() { return { name: "" } } } </script> <style scoped> </style>

router index.js添加路由信息 ：

 

import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld' import Hello from '@/components/Hello' Vue.use(Router) export default new Router({ routes: [ { path: '/', name: 'HelloWorld', component: HelloWorld }, { path: '/Hello', name: 'Hello', component: Hello } ] })