-
- zhangwangyancom 2024-08-05
为什么听了老师讲的课程，我对v-bind和v-on用法更深刻了
- 0赞 · 0采集
-
- zhangwangyancom 2024-08-05
讲的ok哈
- 0赞 · 0采集
-
- 秋光乄5656 2022-02-23
{{msg}}插入变量，插值语法
v-bind；
onclick；
v-if；
：herf；
- 0赞 · 0采集
-
- weixin_慕用7066379 2022-01-08
赞- 0赞 · 0采集
-
- 宝慕林7058063 2021-11-14
加载cdn网站bootcdn,切换node用nvm
- 0赞 · 0采集
-
- cfqlilei 2021-10-28
v-on的缩写：@
v-bind的缩写: 用冒号
- 0赞 · 1采集
-
- cfqlilei 2021-10-28
事件绑定:v-on
<button type="button" v-on:click="submit()"></button>
data:{count:0},
method:{
submit:function()｛
this.count ++
｝
}
- 0赞 · 1采集
-
- cfqlilei 2021-10-28
通过v-bind可以实现页面元素，通过vue的data进行管理、变更。
- 0赞 · 0采集
-
- cfqlilei 2021-10-28
html元素属性的绑定
v-bind
<a v-bind:href='url'>百度</a>
<div class='bg' v-bind:id="bg1">
data:{
bg1:'app-bind'}
- 0赞 · 0采集
-
- cfqlilei 2021-10-28
模板语法
js运算
html模板
链接
绑定链接元素
- 0赞 · 0采集
-
- 殷小恒先生 2021-06-12
模板语法：
- 0赞 · 0采集
-
- 慕慕8558466 2021-04-30
v-bind: #绑定url
@click #绑定事件
通过id进行Vue绑定
<button type ='button' @click=“submit()”></button>
<script>
new Vue({
el:'#app',
data:{
bg1:' app-bind',
msg:'helle vue!',
url:''
}
methods:{
submit:function(){
this.count++
}
}
})</script>
- 0赞 · 0采集
-
- weixin_宝慕林1584548 2021-04-14
new Vue({
el: '#app',
data: {
bg1: 'app-bind',
msg: 'hello vue!!',
count: 0,
template: '<div>hello template</div>'，
url: 'http://www.baidu.com'
},
methods: {
submit: function(){
this.count ++
}
}
})
知识点1
{{(count + 1) * 10}}
可以引用Vue对象data中的属性进行运算
知识点2
<div v-html="template"></div>
输出原始的html代码
知识点3
绑定元素v-bind: 缩写：
例1
原代码：<a href="http://www.baidu.com">百度</a>
修改：<a v-bind:href="url">百度</a>
例2
<div class="bg" v-bind:id="bg1">
知识点4
绑定事件v-on: 缩写@
<button type="button" v-on:click="submit()"></button>
- 0赞 · 0采集
-
- IT太白管理 2021-03-10
Vue:绑定属性和事件：
属性：v-bind: 缩写为“：”冒号
事件：v-on: 缩写为“@”艾特
- 0赞 · 0采集
-
- 七烊 2021-03-02
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vue练习</title> <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.0/vue.common.dev.js"></script> </head> <body> <div id="app"> <h1>你好</h1> <div class="bg"> {{msg}} </div> {{ count }} {{(count+2)*10}} <div id="bi"> <a v-bind:href="url">百度</a> </div> <div v-html="template"></div> <button type="button" v-on:click="submit()">加</button> </div> <script> new Vue({ el: '#app', data: { msg: 'hello vue!!', count: 0, url: 'https://www.baidu.com', template: '<div>你好磨课+++</div>' }, methods: { submit :function(){ this.count++; } } }) </script> </body> </html>- 0赞 · 0采集
-
- 慕前端6319452 2021-02-27
template script style
{{msg}}
{{js表达式}}
<div v-html="template"> //实现语句
<a v-bind:href="url"> //v-bind绑定属性data，简写直接写：(:href="url")
<button v=on:click="submit()"> //v-on绑定事件methods，简写@（@click)
new Vue({
this.count++; //this=Vue
})
- 0赞 · 0采集
-
- 毛利春 2021-01-11
vue小结，缩写指令等
-
截图0赞 · 0采集
-
- 宝慕林1025446 2020-08-07
模板语法总结
-
截图0赞 · 0采集
-
- 宝慕林1025446 2020-08-07
v-bind 绑定属性
v-on 按键点击事件
可以将所有的属性都写到new Vue()中。再里面写属性和方法等
-
截图0赞 · 0采集
-
- 宝慕林1025446 2020-08-07
模板语法的使用
<div v-html="template">
new Vue({
el:'#app',
data:{
msg:"hello value",
count: 0,
template:'<div>hello template</div>'
}
})
-
截图0赞 · 0采集
-
- WE_Xing 2020-08-01
v-on @
v-bind :
-
截图0赞 · 0采集
-
- 桃子熟了呀 2020-05-18
{{ msg }} 在js中为页面msg传值
-
截图0赞 · 0采集
-
- 桃子熟了呀 2020-05-18
v-bind:href="url",绑定属性，缩写为 :href
v-on:click="submit()",绑定方法，缩写为@click
js中new Vue（{
}）
-
截图0赞 · 0采集
-
- 慕侠0204216 2020-04-30
- new vue( el:"#app"， data:{msg:"hello vue!"} )
-
截图0赞 · 0采集
-
- 慕哥6392411 2020-04-24
v-bind：给页面上元素绑定属性，方便统一管理变量，缩写为：
v-on：绑定事件，缩写为@
插值语法：{{ }}
- 0赞 · 0采集
-
- LightXun 2020-04-08
<author>Light Xun</author>
<summary>引用请转明出处</summary>
<title>Vue - 2.3 模板语法</title>
<content>
1. 认识 Vue 文件结构(template, script, style)
2. 模板语法
2.1 插值 {{msg}}
2.2 指令(指令缩写) v-html(不转义), v-text(转义), v-bind:, v-on:, v-model(双向绑定), v-if(真则显示, 假则元素删除), v-show(真则显示, 假则隐藏)
3. 使用 v-html 来实现输出 data 中 html 代码, {{html}} 将被转义
4. 使用 v-bind: 来实现数据绑定, 可将各元素的 id 在 vue 实例中进行绑定, 统一管理, 可缩写为 :属性
5. 使用 v-on: 来实现事件绑定, 在methods 进行实现, 可缩写为 @事件
</content>
- 2赞 · 1采集
-
- 慕粉4366429 2020-03-31
mac打开调试窗口
-
截图0赞 · 0采集
-
- qq_Yabee丶野蜂_0 2020-02-18
v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。
v-if 也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。
相比之下，v-show 就简单得多——不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换。
一般来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。<div id="app"><div v-if="Math.random() > 0.5">Sorry</div><div v-else>Not sorry</div></div>----------<div id="app"><div v-if="type === 'A'">A</div><div v-else-if="type === 'B'">B</div><div v-else-if="type === 'C'">C</div><div v-else>Not A/B/C</div></div>- 1赞 · 1采集
-
- 李℘࿐ 2020-01-27
Vue文件结构 template script style
插值语法
指令与指令缩写
-
截图0赞 · 0采集
-
- 李℘࿐ 2020-01-27
认识Vue
-
截图0赞 · 0采集
