vue项目中父传子如何传递

最新推荐文章于 2024-08-02 09:29:40 发布

余一痴

最新推荐文章于 2024-08-02 09:29:40 发布

阅读量1.1k

点赞数

分类专栏： vue项目文章标签： vue html css es6 node.js

本文链接：https://blog.csdn.net/yycnf/article/details/108345601

版权

本文介绍了在Vue项目中如何从父组件向子组件传递数据的方法：通过在父组件的子组件标签上绑定属性传递值，并在子组件中通过props接收。具体示例包括在`search.vue`子组件和`Home.vue`父组件中的实现。

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

vue项目中父传子如何传递

1、在父组件中给子组件标签上绑定一个属性，属性上挂载需要传递的值

2、在子组件通过props:[“自定义属性名”]来接收数据

实际应用：

1、创建vue项目，在components(子组件)，创建一个组件search.vue,具体内容如下：

<template>
  <div>
 
    <div class="search_top_container">
      <div class="search_input_container">
        <div class="search_input_wrapper">
          <div class="search-input_box">
            <input
              type="text"
              :placeholder="placeHolder"
              v-model="tempTitle"
              @focus="onF