Props og component React

Hej

Håber der er nogen der kan hjælpe med at løse mit problem jeg har kæmpet med længe.
Jeg har en component i react, har et problem med at lave en props ud fra den component så jeg kan genbruge denne kode som laver en select boks og values i den, jeg har en hardcoded string i den lige nu men vil gerne gøre det mere dynamisk.

Min kode til component
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('du har trykket på: ' + 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}>
                {                                                    Vil gerne lave en variable her
                                                                      til
                                                                      props
                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>
        );
    }

}

Har lavet fed skrift ved hardcode value.

Min kode i App så jeg kan se resultatet:

import React from "react";
import UserSelections from "./components/UserSelections";
import './App.css';

function App() {
  return (
    <div className="App">
kunne godt tænke mig at kunne lave en props hvis muligt så jeg skriver value her:
      <UserSelections Her: stringValue="bygnings-st" />
    </div>
  );
}

export default App;

Håber der er en der har en løsning jeg ved simpelthen ikke hvad jeg skal gøre.

Med venlig hilsen
Morten