React props and Component

Question

我有一个问题，我不能解决自己的反应。我要做的是添加道具到我的组件所以我可以一次又一次地使用我的组件只需要一个相对于变量的字符串我可以写，例如

我真的找了一些不同的东西，但没有一个有效。

希望你能让我上车。

希望有意义，否则请随时提问

我的组件

import React, { Component } from "react";
export default class UserSelections extends Component {
constructor(props) {
super(props);
this.state = {
items: [],
DataisLoaded: false,
};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);

}
handleChange(event) {
this.setState({value: event.target.value});
}
handleSubmit(event) {
alert('Your favorite flavor is: ' + this.state.value);
event.preventDefault();
}
// ComponentDidMount is used to
// execute the code
componentDidMount() {
fetch(
"URL")
.then((res) => res.json())
.then((json) => {
this.setState({
items: json,
DataisLoaded: true
});
})
}
render() {
const { DataisLoaded, items } = this.state;
if (!DataisLoaded) return <div>
<h1> Vent et øjeblik... </h1> </div> ;
return (
<div className = "App">
<h1> Fetch data from an api in react </h1>
<form onSubmit={this.handleSubmit}>
<label><select name={this.state.slug} value={this.state.value} onChange={this.handleChange}>
{                             --->Need Variable here<--- Down here 
items.filter(slug => slug.slug === **'bygnings-st'**).map((item, index) => (
<option value={ item.outputvalue }  key={index}>{ item.outputvalue }</option>
))
}</select>
</label>
<input type="submit" value="Submit" />
</form>
</div>
);
}
}
import React from "react";
import UserSelections from "./components/UserSelections";
import './App.css';
function App() {
return (
<div className="App">
<UserSelections **Need props here** /> <-------------------
</div>
);
}
export default App;

致以最亲切的问候Morten

Answer 1

如果你想传递一个字符串作为prop:

const value = "hi";
<UserSelections stringProp={value} />

用

显示值

{this.props.stringProp}

在UserSelections组件内