老师 jsx class外面的 closeModal方法怎么调用class里面的closeIframe

来源：3-9 【组件化】创建class类组件

tokingtop

2022-11-02

老师 jsx class外面的 closeModal方法怎么调用class里面的closeIframe，好像不能用this找不到

import React, { Component,Fragment } from 'react'

function closeModal() {
    this.closeIframe()
}

class Home extends Component {
    constructor(props) {
        super(props)
    }

    closeIframe = (e) => {
        alert(11)
    }

    render() {
        return <Fragment>测试页</Fragment>
    }
}
export default Home;

写回答

1回答

阿莱克斯刘

2022-11-11

从组件外部访问组件可以考虑使用 useRef hook。

import { useRef } from "react";
import ReactDOM from "react-dom/client";
function App() {
  const inputElement = useRef();
  const focusInput = () => {
    inputElement.current.focus();
  };
  return (
    <>
      <input type="text" ref={inputElement} />
      <button onClick={focusInput}>Focus Input</button>
    </>
  );
}
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);

参考：React useRef Hook (w3schools.com)

React18 系统精讲结合TS打造旅游电商平台

React18 精讲 + 结合 TS 实战 + 热门业务开发，获取必备技能

2008 学习 · 1024 问题

查看课程

相似问题

JSX.Element 这里报找不到JSX命名空间？

回答 1

关于react-router-domV6版本，如何在class组件中使用useNavigate钩子

回答 1

我是工作一年的前端，当我开始用React的时候就用的 hook, class的写法都不太会老师怎么看待这件事呢，我该怎么做？

回答 2

老师，我的tsconfig.json中的"jsx"是"react-jsx"和视频中的"jsx":"react"不一样，有影响吗？有什么区别吗？

回答 1

老师这里出问题了，编译出错了？

回答 2

打开慕课网App查看更多内容