2021年的第一天,准备开始着手学习vue了,主要其实还是为了拓展一下自己的知识面,再加上现在前端找工作,大多数都是要会Vue或者React的,所以准备趁着假期时间充足,学习一下vue框架。
其实简单来说,vue的官方教程已经很明确了,但是毕竟人家是开发语言的,就算再怎么细致,也会有想不到的,就想我们想不到居然有人不会写for循环一样。vue的官方文档
vue的官方文档写的非常详细了,但是还是有好多不懂的,比如说vue中的attribute和property,其实我也才看到实例部分,这个是边查边写的,主要是记录一下自己的学习状态。vue中的attribute和property分别是什么简单来说,attribute和property分别是有关html中的内容,attribute是元素标签的属性,而property则是元素对象的属性。
而实际上之所以会引出attribute和property,是因为vue可以直接修改html网页中的变量,比如说最简单的那个例子.
<div id="s1_on">
<p>{{message}}</p>
<input type="button" value="反转" v-on:click="rever">
</div>
var s1_on = new Vue({
el:"#s1_on",
data:{
message: "abcdefg"
},
methods: {
rever:function(){
this.message = this.message.split("").reverse().join("")
}
},
})

通过点击按钮使得本来已经设置的变量进行反转,这就是修改本来的值,当然其实说实在的,还是有更简单的,比如说我们直接在控制台输入创建的vue的名字,后面跟上要修改的属性值,就能进行修改了。
比如说我要修改messsage,那么我可以直接使用s1_on.message="asdasdad"来进行修改。
而我们在vue中对数据进行处理的时候,大多情况下都是默认的对attribute进行处理,而如果要对property进行处理的话,需要在后面加上.prop。

  • 变量作为 attribute 和 property 的 value 的绑定关系会在用户发生交互更新值后失效
  • Vue.js 一般使用 :value 即可让 value 作为 property
  • Vue.js 动态模版需要使用 :value.prop 才可让 value 作为 property

好了,今天的介绍就到这里了,如果想要知道更多的vue的内容,推荐直接去vue的官方文档进行查看,当然,如果有什么不会的也可以在评论区留言,我会在看到的第一时间进行回复的。

本文作者:博主:     文章标题:vue中的attribute和property分别是什么呢?
本文地址:https://zjzdmc.top/jsfx/108.html     
版权说明:若无注明,本文皆为“Datehoer的Blog-个人博客-技术分享”原创,转载请保留文章出处。
最后修改:2021 年 04 月 19 日 07 : 24 PM
如果觉得我的文章对你有用,请随意赞赏