v-text、v-html、v-bind、v-show
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.myPink{color:pink;}
</style>
<script src="js/vue.js"></script>
</head>
<body>
<div id="container">
<p>{{msg}}</p>
<hr>
<h2>v-bind:绑定变量中的值给某属性</h2>
<img v-bind:src="'img/'+imgUrl" alt="">
<hr>
<a v-bind:href="myLink">百度</a>
<hr>
<h4 v-bind:style="{backgroundColor:myBGColor}">背景色</h4>
<button @click="changeBGColor">改色</button>
<hr>
<p v-bind:class="{myPink:isPink}">改变字体颜色</p>
<hr>
<button v-bind:disabled="!isDisabled">按钮</button>
</div>
<script>
new Vue({
el:"#container",
data:{
msg:"Hello VueJs",
imgUrl:"1.jpg",
myLink:"http://www.baidu.com",
myBGColor:"red",
isPink:false,
isDisabled:false
},
methods:{
changeBGColor:function(){
this.myBGColor = "pink";
}
}
})
</script>
</body>
</html>
v-text、v-html、v-bind、v-show的更多相关文章
- addEventListener、onclick和jquery的bind()、click()
addEventListener("click",function(event){},false); removeEventListener("click",f ...
- javascript 面向对象学习（三）——this，bind、apply 和 call
this 是 js 里绕不开的话题,也是非常容易混淆的概念,今天试着把它理一理. this 在非严格模式下,总是指向一个对象,在严格模式下可以是任意值,本文仅考虑非严格模式.记住它总是指向一个对象对于 ...
- 启动服务报错：nested exception is java.lang.NoSuchMethodError: org.apache.cxf.common.jaxb.JAXBUtils.closeUnmarshaller(Ljavax/xml/bind/Unmarshaller;)V
1.启动tomcat时报错:Error creating bean with name 'payInfService': Invocation of init method failed; neste ...
- js中bind、call、apply函数的用法
最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web的项目,然后在腾讯实习的时候用 js 写过一些奇怪的程序,自己也用 js 写过几个的网站.但 ...
- Javascript中bind、call、apply函数用法
js 里函数调用有 4 种模式:方法调用.正常函数调用.构造器函数调用.apply/call 调用. 同时,无论哪种函数调用除了你声明时定义的形参外,还会自动添加 2 个形参,分别是 this 和ar ...
- 博文推荐】Javascript中bind、call、apply函数用法
[博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...
- JavaScript中bind、call、apply函数用法详解
在给我们项目组的其他程序介绍 js 的时候,我准备了很多的内容,但看起来效果不大,果然光讲还是不行的,必须动手.前几天有人问我关于代码里 call() 函数的用法,我让他去看书,这里推荐用js 写服务 ...
- js中bind、call、apply函数的用法 （转载）
最近看了一篇不错的有关js的文章,转载过来收藏先!!! 最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web 的项目,然后在腾讯实习的时候用 j ...
- C++ 11 Lambda表达式、auto、function、bind、final、override
接触了cocos2dx 3.0,就必须得看C++ 11了.有分享过帖子:[转帖]漫话C++0x(四) —- function, bind和lambda.其实最后的Lambda没太怎么看懂. 看不懂没关 ...
- JavaScript中bind、call、apply函数使用方法具体解释
在给我们项目组的其它程序介绍 js 的时候,我准备了非常多的内容,但看起来效果不大,果然光讲还是不行的,必须动手. 前几天有人问我关于代码里 call() 函数的使用方法.我让他去看书,这里推荐用js ...
随机推荐
- React.memo
介绍React.memo之前,先了解一下React.Component和React.PureComponent. React.Component React.Component是基于ES6 class ...
- js+css实现点击回到顶部的效果（最低兼容至ie7）
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 谈Apache OFbiz 会员模块表结构设计
数据库表的结构设计可谓是ofbiz除技术框架之外,另一个非常值得学习的方向.这篇文章我们来谈谈ofbiz对电子商务会员表的设计. PARTY ofbiz对人.团体进行了抽象,称之为party,翻译为中 ...
- 20、前端知识点--html5和css3特性（一）
[html5/css3]css中的flex弹性布局学习总结 https://blog.csdn.net/Umbrella_Um/article/details/99490209 用CSS/CSS3 实 ...
- BUUCTF--SimpleRev
测试文件:https://buuoj.cn/files/7458c5c0ce999ac491df13cf7a7ed9f1/SimpleRev?token=eyJ0ZWFtX2lkIjpudWxsLCJ ...
- OCTAVE-CONFIG
SYNOPSIS 总览 octave-config [--m-site-dir] [--oct-site-dir] [-v|--version] [-h|-?|--help] DESCRIPTION ...
- Elasticsearch Java Low Level REST Client（嗅探器）
https://segmentfault.com/a/1190000016828977?utm_source=tag-newest#articleHeader0 嗅探器 允许从正在运行的Elastic ...
- python常用模块学习3
# # dic='{"name":"tang"}' # # f=open("hello",'w') # # f.write(dic) # # ...
- Codeforces 750E 线段树DP
题意:给你一个字符串,有两种操作:1:把某个位置的字符改变.2:询问l到r的子串最少需要删除多少个字符,使得这个子串含有2017子序列,并且没有2016子序列? 思路:线段树上DP,我们设状态0, 1 ...
- alert(1) to win
一. function escape(s) { return '<script>console.log("'+s+'");</script>'; } 两种思 ...