使用vuejs输出Hello world

来源：互联网发布：淘宝差评可以删除么编辑：程序博客网时间：2024/06/01 10:12

看了大半年的AngularJS一直对与之相提并论的ReactJS及VueJS很感兴趣，简单的写了一个入门演示：

官网是这个：http://vuejs.org/
作者是中国人，还是很自豪的

与Angular类似，需要引入vue.js文件。

示例代码：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <script src="vue.js"></script></head><body>    <div id="app">        <p>{{message}}</p>        <input v-model="message">    </div>    <script>    var exampleData = {        message: "hello world"    }    new Vue({        el: "#app",        data: exampleData    })    </script></body></html>

效果：
这里写图片描述

第一眼感觉跟Angular很像，都用到了{{ }}符号进行数据绑定，而且v-model像极了ng-model的双向绑定，不同之处没用使用到类似ng-controller这样的指令来定义作用域，而是使用Dom属性比如id为app的元素来进行数值绑定。

此文档的作者：justforuse
Github Pages：justforuse

0 0