vue.js入门(21)传值和传引用

传值:string number boolean

传引用:object(对象)    array(数组)

引用:一旦你某个地方发生删除或者添加,整个都会进行改变!(不要忘记基础知识)


1.传值,现在我们想要,App.vue里面的一个数值传到Header.vue文件里面

首先我们先给App.vue里面一个String值

data(){
  return{
  	sendmessage:"传值用法,string,number,boolean"
  }},

然后在template里面种绑定一下传过去

然后在Header.vue文件里面接收

记得类型是String而不是string,然后就可以通过调用sendhea来使用这个数据了

{{ title }}--{{ sendhea }}

效果图:



然后现在我们讲这两者的区别

1.传值

如果现在,我在Header.vue和Footer.vue文件里面同时传过去了这一句话,然后我们都显示出来,在Header.vue里面添加一个点击事件,一旦点击这句话就会变成“改变啦!”,然后这个时候,头部显示出来的效果就是vue.js demo -- 改变啦,但是尾部仍然是vue.js demo --传值用法,string,number,boolean,这就是传值,不会发生改变

2.引用

如果我们在User.vue里面添加一个点击事件,对当前数组点击一下,出栈一个,出栈代码:

methods:{
  deleteuser:function()
  {
  	this.user.pop();
  }
  }

然后我们在App.vue文件里面添加这个数组两次,然后我们发现,点击上面一块的删除按钮,上下都会删除,这就是引用

vue.js入门(21)传值和传引用_第1张图片

(页面问题 图不能截全)


你可能感兴趣的:(vue.js)