首页 > 编程知识 正文

vue组件传参,props父子传值

时间:2023-05-05 09:20:23 阅读:173388 作者:2186

微信保留号: Rabbit_svip组件和组件之间的作用域是相互独立的。 这意味着数据不能互操作。

组件和组件之间的值传递关系包括:

父程序集将数据传递给子程序集。

子组件将数据传递到父组件。

(平面传输)在同级组件之间传输数据。

本节论述父子

在父母传达孩子的过程中,使用的关键词是props

流程如下

HTML代码

div id='app' parent/parent/div! -父程序集--- template id=' parent ' div child : message=' msg '/child/div/template! -子组件--template id=' child ' div { { message } }/div/template js代码

/*次组合*/Vue.component('child ),{template:(#child ), props:('message ) } ) vue实例*/newvue ) )的/*父部件*/components : { ' parent ' : { template } 那里使用了parent。 然后,parent标签中插入了“:消息”。 这里使用了vue的命令(带语法糖)。 全部写下来,应该是V-bind :消息。

我把data中的数据传递给你,所以用了v-bind。

如果只是传输数据的话,不命令也可以。

在子组件中,props用于接收从父组件发送的内容。

微信保留号: Rabbit_svip在部件中,使用props接收到的数据与调用data中的数据的用法相同。

props接收的数据应该在一个对象上接收,这里使用的是排列的方法。

父组件可以同时传输多个不同的数据,子组件可以通过一个props接收,以及通过以上排列接收从多个父组件发送的数据。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。