V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
twofox
V2EX  ›  问与答

Vue3 中, tsx 组件怎么暴露方法提供给父组件调用?

  •  
  •   twofox · 2023-10-21 16:14:09 +08:00 · 284 次点击
    这是一个创建于 398 天前的主题,其中的信息可能已经有所发展或是发生改变。

    例如有一个组件 <DeviceInfoForm ref="formRef"/>

    在父组件可以用过 formRef.value.open(type, id) 调用这个组件的open方法

    子组件 在组合式 API 中是这么写的

    <script setup lang="ts">
    
     //定义一个方法
     const open = () => 
     {
       //忽略
     }
     defineExpose({ open })  //通过这个方法暴露出去
    </script>
    

    但是如果是 tsx/jsx 的方式我要怎么写呢?

    <script lang="tsx">
    export default defineComponent({
      name: 'Form',
      props: {}
      setup(props, { slots, expose, emit }) {
      
      const open = () =>{}
      
      defineExpose({ open })  //这里的写法,父组件似乎无法读取
      
      
      return <></>
      }
    </script>
    
    twofox
        1
    twofox  
    OP
       2023-10-21 16:25:25 +08:00
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2741 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 02:11 · PVG 10:11 · LAX 18:11 · JFK 21:11
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.