vue.jsv-html,关于vue.jsv-bind的一些理解和思考.pdf

关关于于vue.js v-bind 的的一一些些理理解解和和思思考考

一一、、v-bind 初初探探

它是一个 vue 指令，用于绑定 html 属性，如下：

html属性不能使用双大括号形式绑定，只能使用v-bind指令

var vm = new Vue({

el: '#app',

data: {

title: 'title c ntent '

}

});

这里的 html 最后渲染成：

html属性不能使用双大括号形式绑定，只能使用v-bind指令

二二、、指指令令预预期期值值

上面这种 v-bind 这也是我们对于 vue 指令最初的理解，但实际上，vue 指令的预期值 (如 v-bind :class="classProperty" 中，v-

bind 是指令，: 后面的 class 是参数，而 classProperty 则在官方文档中被称为“预期值”)，除了像上面那样绑定一个字符串类型

变量，其实它是支持一个单一 JavaScript 表达式 (v-for 除外)。

所以在这里，我们就可以有更多的选择，例如：

((1))执执行行运运算算

html属性不能使用双大括号形式绑定，只能使用v-bind指令

var vm = new Vue({

el: '#app',

data: {

t1: 'title1',

t2: 'title2'

}

});

最后渲染的结果：

html属性不能使用双大括号形式绑定，只能使用v-bind指令

((2))执执行行函函数数等等

html属性不能使用双大括号形式绑定，只能使用v-bind指令

var vm = new Vue({

el: '#app',

data: {

getTitle: functi n () {

return 'title c ntent ';

}

});

最后渲染的结果：

html属性不能使用双大括号形式绑定，只能使用v-bind指令

三三、、支支持持的的数数据据类类型型

上面的内容，指令预期值得到的都是字符串类型的数据，但实际上，我们知道 j s 有很多数据类型，它如果放入其中呢？

((1))对对象象类类型型

c ntent

var bj = {};

var vm = new Vue({

el: '#app',

data: {

bj: bj

}

});

为什么一来就选择对象类型呢？答案是它比较有代表性，它渲染结果如下：

vue.jsv-html,关于vue.jsv-bind的一些理解和思考.pdf相关推荐

vue后端框架mysql_springboot + vue 前后端结合·数据库查询
springboot + vue 前后端结合·数据库查询数据库部分: /* Navicat Premium Data Transfer Source Server : localHost Sourc ...
【前端】1.学习了一段时间的vue，总结一下Vue书写规范
学习了一段时间的vue,总结一下Vue书写规范命名规范普通变量命名规范常量命名规范组件命名规范 method 方法命名命名规范 views 下的文件命名 props 命名规范结构化规范命名 ...
阿瑶的vue学习笔记(1)Vue核心
1. Vue核心 1.1. Vue简介 1.1.1. 官网英文官网中文官网 1.1.2. 介绍与描述动态构建用户界面的渐进式JavaScript框架作者:尤雨溪 1.1.3. Vue的特点遵 ...
Vue全家桶（Vue基础看这篇就够了）
目录第一章:vue核心 1.1.Vue 简介 1.1.1 官网 1.1.2 Vue是什么? 1.1.3 Vue的特点 1.1.4 Vue周边库 1.2 初识Vue 1.3 模板语法 1.4 数据绑定 ...
怎么将vue模板转换为html,vue中自定义html文件的模板
如果默认生成的 HTML 文件不适合需求,可以创建/使用自定义模板. 一是通过 inject 选项,然后传递给定制的 HTML 文件.html-webpack-plugin 将会自动注入所有需要的 C ...
vue 网络请求 axios vue POST请求 vue GET请求代码示例
QQ技术交流群 173683866 526474645 欢迎加入交流讨论,打广告的一律飞机票 1.安装 axios 和 vue-axios 和 qs (qs是为了解决post默认使用的是x-www-f ...
vue教程2 【Vue组件化编程】组件的创建和使用非单文件组件和单文件组件的区别
组件实现局部功能的代码和资源的集合非单文件组件 1.定义组件(创建组件) 2.注册组件 3.使用组件(写组件标签) 定义使用Vue.extend(options)创建,其中options和new ...
Vue教程1 【Vue核心】
Vue.js 中文文档 (bootcss.com) 使用vue插件 GitHub - vuejs/devtools: ⚙️ Browser devtools extension for debuggi ...
# vue.js 之对vue.js基础理解
vue.js 之对vue.js基础理解 Vue构造器 1 . Vue.js是一个构造函数,编程中称之为构造器 2 . 每一个new Vue() 都是一个Vue构造函数的实例,这个过程叫做实例化 3 ...
VSCode 搭建Vue开发环境之Vue CLI
2019独角兽企业重金招聘Python工程师标准>>> 一.简介说明 1.关于VS Code开发工具,安装和配置,更多可以参考以前文章 2.关于Vue.js,Vue是一个优秀的渐进式 ...

vue.jsv-html,关于vue.jsv-bind的一些理解和思考.pdf

vue.jsv-html,关于vue.jsv-bind的一些理解和思考.pdf相关推荐

最新文章

热门文章