Vue笔记（六）—— Vue 自定义父组件向自定义子组件传值详解

最新推荐文章于 2024-07-23 14:29:05 发布

是是非非iiee

最新推荐文章于 2024-07-23 14:29:05 发布

阅读量871

点赞数

分类专栏： # Vue笔记

本文链接：https://blog.csdn.net/u012382791/article/details/97763215

版权

本文详细介绍了如何在Vue中通过Prop实现自定义父组件向子组件传递数据。包括子组件的props属性设置，以及父组件的关键代码示例。提醒了在模板中使用v-bind避免Interpolation语法，并提供了官方文档和相关博客链接作为参考。

摘要由CSDN通过智能技术生成

1.自定义子组件，示例代码如下：

<template>
  <div>
    <Form>
      <FormItem>
        <Label>
          用户名
        </Label>
        <Input type="text" placeholder="请输入用户名" :value="userDetail.userName"/>
      </FormItem>
      <FormItem>
        <Label>
          登录名
        </Label>
        <Input type="text" placeholder="请输入登录名" :value="userDetail.loginName"/>
      </FormItem>
      <FormItem>
        <Label>
          密码
        </Label>
        <Input type="password" placeholder="请输入密码" :value="userDetail.password"/>
      </FormItem>
    </Form>
  </div>
</template>

<script>
  export default {
    name: "SystemUserDetail",

    props: {

      userDetail: {

        userName: "&