当前位置: 首页 > 知识库问答 >
问题:

vue.js - vue 父组件动态传递ref给子组件应该怎么写?

李云
2023-08-17

父组件动态传递ref给子组件应该怎么写?
父组件调用

 <component ref="ccc" :options="scrollOptions"></component>

子组件

       <div class="listScrollBox" ref="变量" @click="clickComponent">            <slot></slot>            <slot></slot>        </div>

这里我想把父组件传递的ccc动态给子组件,然后操作子组件?

共有1个答案

东方嘉木
2023-08-17

父组件:

<template>  <child-component></child-component></template><script setup>import { ref, provide } from 'vue';import ChildComponent from './ChildComponent.vue';const ccc = ref(null);provide('ccc', ccc);</script>

子组件:

<template>  <div class="listScrollBox" :ref="ccc" @click="clickComponent">    <slot></slot>    <slot></slot>  </div></template><script setup>import { inject } from 'vue';const ccc = inject('ccc');const clickComponent = () => {  // 操作 ccc ref};</script>
 类似资料:
  • 本文向大家介绍怎样将事件传递给子组件?相关面试题,主要包含被问及怎样将事件传递给子组件?时的应答技巧和注意事项,需要的朋友参考一下 这道题出的有问题。 一般情况下我们父组件向子组件传递的不是事件,而是事件处理函数

  • 老师们好,我用el-form封装了一个组件, 父组件想调用这个组件的的this.$refs['formRef'].resetFields() 方法, 测试了一些方法都不好用想请老师们给一个思路,谢谢啦。这个环境是用vue2. 下面是封装子组件的代码:

  • vue3中子组件向父组件传值 在传值的时候为什么只能在声明一个方法的时候传递,而不能在定义click的时候传递呢

  • 本文向大家介绍vue 子组件向父组件传值方法,包括了vue 子组件向父组件传值方法的使用技巧和注意事项,需要的朋友参考一下 子组件注册触发事件,父组件注册 触发子组件事件后的方法写在method里面 父组件这么写 子组件component-a这么写 以上这篇vue 子组件向父组件传值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持呐喊教程。

  • 问题内容: 在React中,我有类似的文件 parent.js 包含文本框和按钮 child.js 包含P标签 App.js 包含父组件和子组件 问题 将“父级”上的“文本框”值传递给子级,并将其显示在子级标记中。 完整代码 堆叠 问题答案: 更新了示例以将数据传递给子组件。 https://stackblitz.com/edit/react- trmj9i?file=child.js 在下面添加

  • 本文向大家介绍Vue通过ref父子组件拿值方法,包括了Vue通过ref父子组件拿值方法的使用技巧和注意事项,需要的朋友参考一下 父拿子的值 子拿父的值 有了ref拿值不能更方便~ 以上这篇Vue通过ref父子组件拿值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持呐喊教程。