vue.js+v-if+&_51CTO博客

Vue.js-v-model

1.1 v-model基本使用 Vue中使用v-model指令来实现表单元素和数据的双向绑定。案例的解析当输入框输入内容时，因为input中的v-model绑定了message。所以会实时将输入的内容传递给message，message发生改变。当message发生改变时，因为上面我们使用Mu ...

html

修饰符

vue.js

创建对象

数据

转载

mob604756fea1c5

2021-10-28 19:53:00

129阅读

2评论

vue.js v-for

代码：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <script type="text/javascript" src="./vue.min.js"></

html

数组

json

javascript

值传

原创

陈业贵的博客

2021-11-16 15:50:02

187阅读

vue.js v-show

代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> div{

html

javascript

css

原创

陈业贵的博客

2021-11-16 15:46:42

117阅读

Vue.js_23_v-for 指令

本系列博客汇总在这里：Vue.js 汇总v-for 指令一、v-for 遍历数组二、v-for 遍历对象源码工程文件为：一、v-for 遍历数组当我们有一组数据需要进行渲染时，我们就可以使用 v-for 来完成。v-for 的语法类似于 JavaScript 中的 for 循环。格式：item in items如果在遍历的过程中不需要使用索引值依次从 array 中取出...

vue

数组

遍历数组

vue.js

唯一标识

原创

wx5b04e97300ec7

2021-08-19 15:36:50

136阅读

Vue.js_19_v-on 指令

本系列博客汇总在这里：Vue.js 汇总v-on 指令一、事件监听二、v-on 基础三、v-on 参数四、v-on 修饰符源码工程文件为：一、事件监听在前端开发中，我们需要经常和用于交互。这个时候，我们就必须监听用户发生的时间，比如点击、拖拽、键盘事件等等。在 Vue.js 中如何监听事件呢？v-on作用：绑定事件监听器缩写：@预期：Function | Inline S...

vue

修饰符

事件监听

vue.js

拖拽

原创

wx5b04e97300ec7

2021-08-19 15:36:54

55阅读

Vue.js_23_v-for 指令

本系列汇总在这里：Vue.js 汇总 v-for 指令一、v-for 遍历数组二、v-for 遍历对象

vue

数组

遍历数组

vue.js

原创

wx5b04e97300ec7

2022-01-15 13:36:21

51阅读

Vue.js_19_v-on 指令

本系列汇总在这里：Vue.js 汇总 v-on 指令一、事件监听二、v-on 基础三、v-on 参数四、v-on 修饰

vue

修饰符

事件监听

vue.js

原创

wx5b04e97300ec7

2022-01-15 13:41:35

18阅读

vue.js之v-for

v-for 指令（列表渲染）list是数组 <div id="app"> <div v-for="item in list">{{item}}</div> </div

vue

vue-js

v-for

数组

原创

BingCola

2022-07-20 06:28:19

71阅读

vue.js. v-model

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <script type="text/javascript" src="./vue.min.js"></scri

html

javascript

JavaScript

原创

陈业贵的博客

2021-11-16 15:50:02

140阅读

Vue.js_20_v-if、v-else-if、v-else 指令

本系列博客汇总在这里：Vue.js 汇总v-if、v-else-if、v-else 指令一、简要说明二、v-if 的原理源码工程文件为：一、简要说明v-if、v-else-if、v-else 这三个指令与 JavaScript 的条件语句 if、else、else if 类似。Vue 的条件指令可以根据表达式的值在 DOM 中渲染或销毁元素或组件。简单的案例演示：二、v-if ...

vue

工程文件

javascript

条件语句

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:39:56

209阅读

Vue.js_20_v-if、v-else-if、v-else 指令

本系列汇总在这里：Vue.js 汇总

vue

工程文件

vue.js

条件语句

原创

wx5b04e97300ec7

2022-01-15 13:37:13

100阅读

Vue.js_22_v-show 指令

本系列博客汇总在这里：Vue.js 汇总v-show 指令一、说明及使用方法二、v-if 和 v-show 对比源码工程文件为：一、说明及使用方法v-show 的用法和 v-if 非常相似，也用于决定一个元素是否渲染。二、v-if 和 v-show 对比v-if 和 v-show 都可以决定一个元素是否渲染，那么开发中我们如何选择呢？v-if 当条件为 false 时，压根...

vue

工程文件

属性设置

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:36:53

64阅读

Vue.js_10_v-once 指令

本系列博客汇总在这里：Vue.js 汇总v-once 指令使用场景源码工程文件为：使用场景在某些情况下，我们可能不希望界面随意的跟随改变，这个时候，我们就可以使用一个 Vue 的指令。v-once:该指令后面不需要跟任何表达式（比如之前的 v-for 后面是由跟表达式的）。该指令表示元素和组件（组件后面才会学习）只渲染一次，不会随着数据的改变而改变。如下：如有错误，...

vue

使用场景

数据

工程文件

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:37:04

100阅读

Vue.js_14_v-cloak 指令

本系列博客汇总在这里：Vue.js 汇总v-cloak 指令使用场景源码工程文件为：使用场景在某些情况下，我们浏览器可能会直接显示出未编译的 Mustache 标签，就像下面这样的。这种情况我们也是可以做出调整的，如下：如有错误，欢迎指正！...

vue

使用场景

工程文件

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:36:56

107阅读

Vue.js_12_v-text 指令

本系列博客汇总在这里：Vue.js 汇总v-text 指令使用说明源码工程文件为：使用说明v-text 作用和 Mustache 比较相似：都是用于将数据显示在界面中。v-text 通常情况下，接受一个 string 类型。如下：如有错误，欢迎指正！...

vue

使用说明

数据

工程文件

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:36:58

71阅读

Vue.js_13_v-pre 指令

本系列博客汇总在这里：Vue.js 汇总v-pre 指令使用说明源码工程文件为：使用说明v-pre 用于跳过这个元素和它子元素的编译过程，用于显示原本的 Mustache 语法。比如下面的代码：如有错误，欢迎指正！...

vue

使用说明

工程文件

编译过程

vue.js

原创

wx5b04e97300ec7

2021-08-19 15:37:00

84阅读

Vue.js_11_v-html 指令

本系列博客汇总在这里：Vue.js 汇总v-html 指令使用场景源码工程文件为：使用场景在某些情况下，我们从服务器请求到的数据本身就是一个 HTML 代码，如果我们直接通过 {{ }} 来输出，会将 HTML 代码也一起输出。但是我们可能希望的是按照 HTML 格式进行解析，并且显示对应的内容。如果我们希望解析出 HTM L展示，可以使用一个 Vue 指令：v-html该指令...

vue

html

使用场景

vue.js

服务器

原创

wx5b04e97300ec7

2021-08-19 15:37:02

107阅读

Vue.js_12_v-text 指令

本系列汇总在这里：Vue.js 汇总 v-text 指令使用说明

vue

使用说明

工程文件

数据

原创

wx5b04e97300ec7

2022-01-15 13:38:57

50阅读

Vue.js_14_v-cloak 指令

本系列汇总在这里：Vue.js 汇总 v-cloak 指令使用场景

vue

使用场景

工程文件

vue.js

原创

wx5b04e97300ec7

2022-01-15 13:39:47

63阅读

Vue.js_28_v-model 指令

本系列博客汇总在这里：Vue.js 汇总v-model 指令使用说明源码工程文件为：使用说明表单控件在实际开发中是非常常见的。特别是对于用户信息的提交，需要大量的表单。Vue 中使用 v-model 指令来实现表单元素和数据的双向绑定。案例的解析：当我们在输入框输入内容时，因为 input 中的 v-model 绑定了 message，所以会实时将输入的内容传递给 messag...

vue

修饰符

数据

输入框

数组

原创

wx5b04e97300ec7

2021-08-19 15:35:05

232阅读

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

vue.js+v-if+&

Vue.js-v-model

vue.js v-for

vue.js v-show

Vue.js_23_v-for 指令

Vue.js_19_v-on 指令

Vue.js_23_v-for 指令

Vue.js_19_v-on 指令

vue.js之v-for

vue.js. v-model

Vue.js_20_v-if、v-else-if、v-else 指令

Vue.js_20_v-if、v-else-if、v-else 指令

Vue.js_22_v-show 指令

Vue.js_10_v-once 指令

Vue.js_14_v-cloak 指令

Vue.js_12_v-text 指令

Vue.js_13_v-pre 指令

Vue.js_11_v-html 指令

Vue.js_12_v-text 指令

Vue.js_14_v-cloak 指令

Vue.js_28_v-model 指令

Vue.js_28_v-model 指令

Vue.js_22_v-show 指令

Vue.js_13_v-pre 指令

Vue.js_11_v-html 指令

Vue.js_10_v-once 指令

vue.js之v-on与v-bind

vue.js之v-show 与 v-if

[Vue] Conditionally Render DOM Elements in Vue.js (v-if v-else v-show)

Vue.js 条件渲染 v-if、v-show、v-else