一、父组件像子组件传递参数

  

 

 

 好了,上面的图片显而易见,:movies就是动态绑定的属性,它是向组件xsMovies中传递参数,值是item,那么我们怎么在xsMovies这个组件中去接收呢?

  

 

 

 就这样就可以用props属性来接收参数了,不需要再在data里面来定义,不然就会报错的,现在只需要把movies对象里面值在页面渲染即可。

二、props的书写方式

  

 

    上面就是直接传参的形式

 

   

 

     这个就是检验传入参数的类型

  

 

 

   我们一般只是使用到上面所圈出的类型,一下的不是必须的参数,实在用不到的话是可以进行省略的。

三、子组件像父组件专递参数

  首先的是组件的引入,这个我不在赘余。

  

 

 

   向父组件中注册一个input事件,传递参数e

  

 

 

   这个我们就只需要在    methods:{} 里面触发 etFist(value){} 方法即可,其中 value 就是我们传递过来的 e

  注:这里特别强调下,我们的子组件是不能够更改父组件所传递过来的参数的,那么我们只能够将值返回给福父组件即可,在父组件里面来进行操作

四、兄弟组件的传参

  这个我得强调下不是很常用,我们也可以使用VUEX来解决这个问题

  还是来看看下面的问题吧

  

 

 

   上面的page和loading是同级的组件,那么我们怎么来操作呢?

  好了我们接下来创建一个空的js文件,里面来进行书写

  

  接下来我们在两个组件中都引入它

  

 

 

   再点击事件中我们来进行操作

  

 

   这是其中的一个组件的书写方式,他将e给抛出来

  另一个接收的组件书写如下

  

 

   好了,这就是我们兄弟组件的传递方式,当然还有其它的方法,我这里就不在过多的介绍了。

  还是简单的说下第二种方式吧

  可以在main.js中输入

·· 

 

   接下来的传参,我们已经创建了一个全局的了,因此就不需要其它的了

  

 

   接收参数的兄弟组件是一样的道理了哈,就不在书写。

 

  

posted on 2020-03-02 22:25  镇宁  阅读(545)  评论(0编辑  收藏  举报