Vue.js 互动版

vue.js 简介
一个渐进式前端框架 安装方式:直接引入、CDN、NPM 第一个vue.js实例 Hello World 通过构造器函数创建实例 响应式的数据(Data)属性与方法
数据绑定模版语法
模版中文本插值的“Mustache”语法 模版语法如何处理原始 HTML 数据绑定HTML特性(Attributes) JavaScript表达式 过滤器-可自定义的函数 指令(Directives) 通过计算属性处理逻辑
Class列表与Style样式的数据绑定
绑定Html Class对象语法 绑定Html Class数组语法 绑定内联样式Style对象语法 绑定内联样式Style数组语法
渲染指令
条件渲染指令 v-if template元素条件渲染 v-if 条件渲染 v-show 条件渲染 v-else 列表渲染指令 v-for template元素列表渲染 v-for
表单控件输入绑定
文本输入框 Text 多选框 Checkbox 单选按钮 Radio 选择下拉列表 Selected 修饰符参数特性 lazy、number、trim
自定义指令
自定义指令基础(钩子函数) 指令实例属性 指令对象字面量 指令对象字面修饰符 自定义元素指令
自定义过滤器
自定义过滤器基础 双向自定义过滤器 过滤器的动态参数
方法与事件处理器
方法处理器 内联语句处理器 事件处理的修饰符 按键处理的修饰符
过渡和动画效果
过渡动画效果简介 CSS 过渡动画 过渡的CSS类名 过渡流程详解示例 渐近的动态过渡
组件
组件的注册组合构造 Props传递数据给子组件 动态Prop用作特性 通过 Props 绑定类型实现单双向绑定 自定义通信事件示例
在线工具推荐: Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编辑器

安装

独立版本

直接下载并用 < script > 标签引入,Vue会被注册为一个全局变量。如下代码,这样就可以在脚本中使用Vue.js了。

<script src="lib/vue.js"></script>

CDN

也可以在 jsdelivrcdnjs获取 (版本更新可能会略滞后)。

NPM

在用 Vue.js 构建大型应用时推荐使用 NPM 安装,NPM 能很好地和诸如 Webpack 或 Browserify 的 CommonJS 模块打包器配合使用。Vue.js 也提供配套工具来开发单文件组件。

$ npm install vue

获取CSP兼容版本:

$ npm install vue@csp

获取最新开发版本(来自于GitHub):

$ npm install yyx990803/vue#dev