我想在具有动态呈现元素的功能组件中使用 refs。
请帮助我使用 useRef Hook 创建动态 Refs 并在处理程序中访问。
1) 需要创建 3 个 useRefs 来指向 3 个按钮。
2)使用“ref1.value”或“ref2.value”等在按钮处理程序中访问它们
let abc=[1,2,3];
function submitclick(){
alert(123);
// Here i want to access the buttons with using the refs
}
return ( <div>
{ abc.map(function(index){ return (<button ref='123' onClick={submitclick}>{`Button${index}`}</button>)})}
</div>);
};
ReactDOM.render(<MyComponent name="doug" />, document.getElementById('root'));```
Run Code Online (Sandbox Code Playgroud) 我无法动态创建React组件.我看到空白页面,下面的代码没有错误.
1)尝试创建名为"PieChart"的元素
2)下面是我在控制台中看到的两个错误.
1. Warning: <PieChart /> is using incorrect casing. Use PascalCase for
React components, or lowercase for HTML elements.
2. Warning: The tag <PieChart/> is unrecognized in this browser. If you
meant to render a React component, start its name with an
uppercase letter.
Run Code Online (Sandbox Code Playgroud)
3)我已经在使用Pascal案例"PieChart"
import PieChart from "../component/PieChart";
class App extends Component {
render() {
const GraphWidget = React.createElement("PieChart");
return (
<div>
{GraphWidget}
</div>
)
}
}
export default App;
Run Code Online (Sandbox Code Playgroud)