我有以下场景： 表单中其中一个输入字段的值取决于下拉列表选择。例如，如果我选择“衬衫”，我想用衬衫图片的 URL 填充输入字段。我有以下代码。我需要帮助选择与用户选择相对应的正确值：

class ProductAdd extends React.Component{

constructor(){
    super();
    this.state = { defaultPrice: '$',
                    categoryValue: '',
                    URL: [
                        {
                            shirts: "https://www.istockphoto.com/photo/formal-shirt-with-button-down-collar-isolated-on-white-gm856917576-141225609",
                            jeans: "https://www.istockphoto.com/photo/blue-jeans-isolated-with-clipping-path-gm600373506-103229995",
                            jackets: "https://www.istockphoto.com/photo/black-hoodie-mock-up-gm695933044-128721993",
                            sweaters: "https://www.istockphoto.com/photo/formal-shirt-with-button-down-collar-isolated-on-white-gm856917576-141225609",
                            accessories: "https://www.shutterstock.com/image-vector/hair-accessories-woman-items-stylist-salon-1451306021"
                        }
                    ],
                };
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleChange = this.handleChange.bind(this);     
}

handleSubmit(e){
    e.preventDefault();
    const form = document.forms.productAdd;
    const product = {
        productName: form.productName.value, 
        category: form.category.value,
        price: form.price.value,
        image: form.image.value
        }
        this.props.createProduct(product);
        form.productName.value="";
        form.category.value="";
        form.price.value="";
        form.image.value="";
    }

handleChange(e){
    this.setState( { defaultPrice: e.target.value });
}



render(){
    let btnClass = [
        'btn',
        'clearfix'
      ]
      btnClass = btnClass.join(' ');

      Object.keys(this.state.URL).map(i => alert(this.state.URL['shirts']));

      //console.log(this.state.URL.shirts);

    return(
        <div>
            <form name="productAdd" onSubmit={this.handleSubmit} className="form">
                <div className="div1">
                    Category <br/>
                    <select name="category" className="selectBox"  onChange={ (e) => this.setState( { categoryValue: e.target.value }) }>
                        <option value="shirts">Shirts</option>
                        <option value="jeans">Jeans</option>
                        <option value="jackets">Jackets</option>
                        <option value="sweaters">Sweaters</option>
                        <option value="accessories">Accessories</option>
                    </select><br/><br/>
                    Product Name <br/>
                    <input type="text" name="productName" /><br/><br/>
                </div>
                <div className="div2">
                    Price Per Unit <br/>
                    <input ref="price" type="text" name="price" onChange={ this.handleChange } value={this.state.defaultPrice} /><br/><br/>                    
                    Image URL<br/>
                    <input type="text" name="image" value={this.state.URL[this.state.categoryValue]} /><br/><br/>
                </div>

                <button className={btnClass}>Add Product</button>
            </form>
    </div>
    );
}

>