Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implemented method that obtain the internal reference of the React component. #4

Merged
merged 3 commits into from
Jul 20, 2023

Conversation

juanparati
Copy link

@juanparati juanparati commented Jul 20, 2023

Actually is not possible to call React components methods from Vue, because the internal reference bind to the React component is missing. I implemented a way to obtain the internal reference calling the "reactRef" method.

Example:

<template>
<div>
    <MyReactComp ref="myReactComp" />
    <button type="button" @click="$refs.myReactComp.reactRef().reactMethodFooBar()">Call React Method</button>
</div>
</template>

<script>
import { ReactInVue } from "vuera-ts";
import { ReactComp } from "./ReactComp";

const MyReactComp = ReactInVue(MyReactComp);

export default {
  name: "VueApp",
};
</script>

@tachyon-ops
Copy link
Owner

tachyon-ops commented Jul 20, 2023

$refs.myReactComp.reactRef().reactMethodFooBar() does the IDE figure the reactMethodFooBar type - so does the typing works with autocompletion?

edit: just noticed it doesn't.

@tachyon-ops tachyon-ops merged commit 3bf6372 into tachyon-ops:master Jul 20, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants