我有这个错误消息:找不到名称“渲染”。ts(2304)然后我做了谷歌搜索,但找不到任何关于渲染的东西。我不知道“渲染”有什么问题。
import React from "react";
import HoverButtons from "./HoverButtons";
const evStop = (ev:any) => {
ev.preventDefault();
ev.stopPropagation();
ev.nativeEvent.stopImmediatePropagation();
};
function HoverMenus () {
const state = { hiddenPopupMenu: true };
const toggle = () => {
this.setState({ hiddenPopupMenu: !this.state.hiddenPopupMenu });
};
const clkBtn = (ev:any, msg:any) => {
evStop(ev);
this.props.flashFn(msg);
};
// ***error message : Cannot find name 'render'.ts(2304)***
render() {
const p = {
funcs: {
interested: (e:any) => this.clkBtn(e, "interested"),
}
};
return (
<div className="whenhovered" onClick={this.toggle}>
{this.state.hiddenPopupMenu && (
<div>
<div className="mt-5 pt-5" />
<div className="mt-5" />
<HoverButtons
txt="LIKE"
icon="thumbs-up"
clicked={p.funcs.interested}
/>
</div>
)}
</div>
);
}
}
export default HoverMenus;
您混合在类组件和函数组件之间,要使用类组件将您的函数转换为类并添加将React. Component
扩展到您的类:
class HoverMenus extends React.Component {
}
要使用函数组件,您需要将语法排序更改为https://reactjs.org/docs/components-and-props.html
“渲染”是一个类组件方法。它不适用于函数式组件。
试试这个:
import {useState} from 'react'
function HoverMenus (props) {
const [hiddenPopupMenu, setHiddenPopupMenu] = useState(true)
const toggle = () => {
setHiddenPopupMenu(!hiddenPopupMenu);
};
const clkBtn = (ev:any, msg:any) => {
ev.stopPropagation();
props.flashFn(msg);
};
const p = (e:any) => clkBtn(e, "interested");
return (
<div className="whenhovered" onClick={toggle}>
{hiddenPopupMenu && (
<div>
<div className="mt-5 pt-5" />
<div className="mt-5" />
<HoverButtons
txt="LIKE"
icon="thumbs-up"
clicked={p}
/>
</div>
)}
</div>
);
}
export default HoverMenus;