我的单选按钮没有出现（React-Redux 和 Materialise CSS）

Question

我正在尝试制作一个允许用户提出 true/false 问题的网站。我环顾四周，无法弄清楚为什么这些单选按钮没有出现在这个 React 组件中（使用 Materialize CSS）。

render() {

        const { courseTitle, courseDescription } = this.props;


        return (

            <div className='container selection create-lecture'>

                <div className='row'>

                    <form onSubmit={this.handleSubmit} className='white'>
                        <h5 className='grey-text text-darken-3'>True / False Question</h5>
                        <p></p>

                        <div className='input-field'>
                            <label htmlFor='questionQuestion'>Your True/False Question:</label>
                            <textarea className='materialize-textarea' id='questionQuestion' onChange={this.handleChange}>
                            
                            </textarea> 
                        </div>

                        <p>
                            <input id='radio-true' type="radio" value="true" checked={this.state.selectedRadioOption === "true"} onChange={this.onValueChange}/>
                            <label htmlFor='radio-true'>True</label>

                        </p>
                        
                        <p>
                            <input id='radiofalse' type="radio" value="false" checked={this.state.selectedRadioOption === "false"} onChange={this.onValueChange}/>
                            <label htmlFor='radiofalse'>False</label>

                        </p>


                        <div className='input-field'>
                            <button className='btn custom-orange lighten-1 z-depth-0'>Create Question</button>
                        </div>

                    </form>

                </div>

            </div>
        )
        
    }

}

结果：

Answer 1

您需要使用文档中所示的正确标记。 :

<label>
  <input name="group1" type="radio" checked />
  <span>Red</span>
</label>

标签（包装）
输入
跨度

Materialize 不使用浏览器默认单选按钮。始终使用 docs!

建议的标记

我的单选按钮没有出现（React-Redux 和 Materialise CSS）

My Radio Buttons don't appear (React-Redux & Materialize CSS)

forms

radio-button

materialize

reactjs