Vue开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 4 天，[点击查看活动详情] vue介绍 v

开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 4 天，[点击查看活动详情]

vue介绍

vue.js是构建数据驱动的web界面的渐进式框架。
目标：通过简单的API实现响应式的数据绑定和组合的视图组件。
优点：易上手，便于与第三方库或既有项目整合。高效，便捷。
在视图层和模型层中让其耦合起来，在前端设计时将数据和视图有机的融合起来，响应。

mvvm模式

MVVM:Model-View-ViewModel
Model:数据，用java--bin,dao,来保存数据,对数据库进行增删改查操作。\ View:视图层。jsp,html.(MVC的c是控制层)
mvvm和mvc的区别：本质是mvc的改进版。mvvm是将mvc的View的状态和行为抽象化，将视图UI和业务逻辑分开。
目的是分离视图v和模型m
vue.js提供了mvvm风格的双向数据绑定的javascript库，专注于view层。核心是vm（负责连接view和model，保证视图和数据的一致性）。

vue.js语法规则

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/vuejs-2.5.16.js"></script>
</head>
<body>
    <div id="app">
        {{message}}
    </div>
</body>
<script>
    new Vue({
        el:"#app",
        data:{
            message:"hello world!!!!!!"
        }
    });
</script>
</html>

vuejs常用系统指令

v-on:监听DOM事件，并在触发时运行一些JavaScript代码。在监听键盘事件时添加按键修饰符：.enter,.tab,.delete,.esc,.space,.up,.down,.left,.right,.ctrl,.alt,.shift,.meta。
v-text:显示的是冒号后的，不认标签。
v-html:认标签。
v-for:循环。数组。< li v-for="(item,index) in list">{{item+" "+index}}\

和web相比是一种轻量级的开发。vue将数据和视图有机的结合起来。