绑定属性 - v-bind
未绑定
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Document</title>
<style type="text/css">
[v-cloak]{
display: none;
}
</style>
</head>
<body>
<div id="app">
<div>{{msg2}}</div>
<div v-text="msg2"></div>
<!-- 前两个只是打印 <h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>-->
<!-- v-html可以打印html标签 -->
<div v-html="msg2"></div>
<!-- v-bind 是Vue 中提供用于绑定属性的指令 -->
<input type="button" value="按钮" title="mytitle">
</div>
<script src="./lib/vue.min.js"></script>
<script>
var vm=new Vue({
el:'#app',
data:{
msg:'123',
msg2:'<h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>',
mytitle:'这是一个自己定义的title'
}
})
</script>
</body>
</html>
绑定
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Document</title>
<style type="text/css">
[v-cloak]{
display: none;
}
</style>
</head>
<body>
<div id="app">
<div>{{msg2}}</div>
<div v-text="msg2"></div>
<!-- 前两个只是打印 <h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>-->
<!-- v-html可以打印html标签 -->
<div v-html="msg2"></div>
<!-- v-bind 是Vue 中提供用于绑定属性的指令 -->
<input type="button" value="按钮" v-bind:title="mytitle"> //mytitle是一个变量 后面还可以+ ‘123’ //： == v-bind: (简写)
</div>
<script src="./lib/vue.min.js"></script>
<script>
var vm=new Vue({
el:'#app',
data:{
msg:'123',
msg2:'<h1>哈哈，我是一个大大的H1，我大，我骄傲</h1>',
mytitle:'这是一个自己定义的title'
}
})
</script>
</body>
</html>
绑定属性 - v-bind的更多相关文章
- [十六]SpringBoot 之 读取环境变量和绑定属性对象
1.读取环境变量 凡是被spring管理的类,实现接口EnvironmentAware 重写方法 setEnvironment 可以在工程启动时,获取到系统环境变量和application配置文件中的 ...
- jQuery事件绑定on()、bind()与delegate() 方法详解
jquery中有四种事件绑定函数,bind(),live(),on(),delegate(),由于live现在并不常用,因此不做过多解释. 1. bind()用法 $("div p" ...
- Compounding绑定属性
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- react事件处理函数中绑定this的bind()函数
问题引入 import React, { Component } from 'react'; import { Text, View } from 'react-native'; export def ...
- class中限定绑定属性__slots__方法
使用__slots__但是,如果我们想要限制class的属性怎么办?比如,只允许对Student实例添加name和age属性.为了达到限制的目的,Python允许在定义class的时候,定义一个特殊的 ...
- Vue 目录结构 绑定数据 绑定属性 循环渲染数据
一.目录结构分析 node_modules 项目所需要的各种依赖 src 开发用的资源 assets 静态资源文件 App.vue 根组件 main.js 配置路由时会用 .babelrc 配置文件 ...
- v-bind绑定属性样式——class的三种绑定方式
1.布尔值的绑定方式 <div id="demo"> <span v-bind:class="{‘class-a‘:isA ,‘class-b‘:isB ...
- React对比Vue（02 绑定属性，图片引入，数组循环等对比）
import React, { Component } from 'react'; import girl from '../assets/images/1.jpg' //这个是全局的不要this.s ...
- Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定
Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定 创建 angular 组件 https://github.com/angular/angular- ...
随机推荐
- Codeforces Round #505 (Div 1 + Div 2 Combined) Solution
从这里开始 题目列表 瞎扯 Problem A Doggo Recoloring Problem B Weakened Common Divisor Problem C Plasticine zebr ...
- R语言环境变量的设置 环境设置函数为options()
环境设置函数为options(),用options()命令可以设置一些环境变量,使用help(options)可以查看详细的参数信息. 1. 数字位数的设置,options(digits=n),n一般 ...
- Bioconductor软件安装与升级
1 安装工具Bioc的软件包不能使用直接install.packages函数,它有自己的安装工具,使用下面的代码: source("https://bioconductor.org/bioc ...
- 使用Docker方式创建3节点的Etcd集群
一.简要说明 二.运行容器 三.验证集群 四.运行截图 五.参考链接 一.简要说明 参考etcd官网文档, 在node1.node2.node3三个节点上,分别运行etcd容器,创建etcd集 ...
- 力扣（LeetCode）482. 密钥格式化
给定一个密钥字符串S,只包含字母,数字以及 '-'(破折号).N 个 '-' 将字符串分成了 N+1 组.给定一个数字 K,重新格式化字符串,除了第一个分组以外,每个分组要包含 K 个字##符,第一个 ...
- js的点滴2
博客: 1.大牛博客:每一篇博客都需要仔细的看.http://blog.csdn.net/hongchh/article/details/54744318 2.layui:的作者 贤心的博客:http ...
- 整合Druid数据源
pom依赖: <!--引入druid数据源--> <!-- https://mvnrepository.com/artifact/com.alibaba/druid --> & ...
- 安卓MVP框架
一.理解MVP 原文地址 我的Demo 效果图: 项目结构: 实现 一.Model层 首先定义一个实体类User package app.qcu.pmit.cn.mvpdemo.model; /** ...
- input type="tel" 输入框显示密文
为了在移动端实现密码输入框且调起的键盘为数字键盘,可以用-webkit-text-security:disc;text-security:disc;属性来实现. 语法: text-security: ...
- 在git服务器上创建项目过程及遇到的问题
一: 登录git服务器,输入用户名,密码等 二: New Project 添加项目 设置组可见,项目名称等. 创建成功的项目可以看到该项目的clone地址,可以通过http,ssh两种方式来获取: 三 ...