简介
Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。
Vue在ES6语法也完全好用，这是一个非常便捷的方式。
使用一段时间之后，今天一起来记录和总结常用的开发的组件。
这里就在讲解的一些组件的时候就直接贴代码了，然后添加注释这样比较好了解，以后遇到相同的问题也好来浏览记录。
实例
如下代码，让我认识Vue是如何填充数据的。
<script>
window.onload = function () {
new Vue({
el: "#box",//指定的跟元素Id
data: {//填充的数据
msg: "hello vue!",//key必须对应html里面的标识msg 必须用{{}}包围这个字段，这就是插值表达式，如下完整案例的代码{{msg}}
}
})
}
</script>
使用Vue步骤
- 1和我们平时开发的javascript的代码一样的，我们需要引入Vue.js的依赖库。下载到本地或者直接在
<head></head>标签中添加
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> - 2在
<script></script>标签中书写Vue.js的代码 - 3.运行完成。
完整实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue的简单实例</title>
<script src="js/vue.js"></script>
<script>
window.onload = function () {
new Vue({
el: "#box",//指定的跟元素Id
data: {//填充的数据
msg: "hello vue!",//key必须对应html里面的标识msg 必须用{{}}包围这个字段，这就是插值表达式
}
})
}
</script>
</head>
<body>
<div id="box">
{{msg}}
</div>
</body>
</html>
输出的结果就是： hello vue!
案例下载
这里有需要Vue的实例，每个组件或者小模块示例。
1327
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
