01vue.js 初步学习

我的第一个博客

说明：这是我的第一个博客，所以看起来可能没有那么美观，不过能学到东西就OK啦！

1.先说说为什么学习vue.js

methods 只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。
vue.js兼具angular.js和react的优点，并且剔除了他们的缺点。
vue官网：vue.js

2.vue 是什么？

Vue是一个构建用户界面点的渐进式框架 ，与其他重量级框架不同的是，vue采用自底向上增量开发的设计。
vue的核心库"只关注视图层"，并且"非常容易学习"，非常容易与其他库或者已有的项目整合
vue的目标是通过尽可能简单的API实现"响应的数据绑定"和"组合的视图组件"

3.MVVM —分手大师

MVVM在概念上是真正将页面与数据逻辑分离的模式，在开发方式上，它是真正将前台代码开发者（JS+HTML）与后台代码开发者分离的模式（asp,asp.net,php,jsp）
双向绑定：view的变动，自动反映在viewModel,反之亦然

基础的代码展示：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=11,IE=10,IE=9,IE=8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <title>Title</title>
</head>
<body>

<div id="app">
    <h1 id="">{{msg}}</h1>
    <input id="xx" type="text" v-model="msg">
</div>

<script src="bower_components/vue/dist/vue.js"></script>
<script>
    (function () {

        new Vue({
            el:"#app",
            data:{
                msg:"hello"
            }
        })
    })()
</script>
</body>
</html>

vue 的安装

①前提得先安装node、git （一路回车就行）
②在安装bower —命令行：npm i -g bower
③最后安装vue即可 —命令行:bower i vue

vue的教学视频：https://pan.baidu.com/s/1z8-3lEAlxBWTYZ3o8sa_MA

关于vue的编译和安装步骤将在下篇讲解

我的第一个博客

猜你喜欢