vue 使用JavaScript表达式
2024-09-01 12:42:47
vue使用JavaScript的运算方式
代码如下:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue.js 使用 javascript </title>
<script src="vue.js"></script>
</head>
<style>
.color_1{color: red;}
.color_2{color: blue;}
</style>
<body>
<div id="ask"><!--vue不能控制body和html的标签-->
<h1>{{num}}</h1>
<h2 v-once="">{{num}}:v-once</h2>
{{num+1}}<!--表达式-->
<h1 :class="'color_'+num">{{title}}</h1>
<input type="text" v-model="num"> <input type="radio" v-model="num" value="1">color_1
<input type="radio" v-model="num" value="2">color_2
</div>
<script>
var app = new Vue({ //实例化vue
el:'#ask',//vue控制id为ask的元素,
data:{
title:'',
num:1,
}
});
</script> </body>
</html>
最新文章
- mysql之show engine innodb status解读
- HashCheck
- C++11中的右值引用
- codevs1011 数的计算 2001年NOIP全国联赛普及组
- 恭贺自己itpub和csdn双双获得专家博客称号
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(4)-构建项目解决方案 创建EF DataBase Frist模式
- Hug the princess(思维,位运算)
- DOM简要
- 怎么在ng-repeat生成的元素上操作dom
- hdu4632
- 质量管理:PDCA循环
- Redis 5种数据结构
- Python——安装requests第三方库
- Html5与Css3知识点拾遗(七)
- 远程连接服务器或云数据库上的mysql服务 - 赖大大
- Java中的BlockingQueue队列
- Android实现选择题答题(包括单选、多选和答题卡)
- progress 进度条
- CSS中text-shadow的几个好看的文字demo及其代码
- selenium之鼠标事件