2015-07-13 2 views
0

Я хочу выбрать значение по умолчанию для радио. Я использую v0.13.3, который отличает checked={value===selected_value}, установив атрибут checked, если выражение принимает значение true.Как выбрать выбор глухого с помощью радиокнопки - в React

В полученном HTML (отформатированном мной) соответствующая радиокнопка checked ed, но я не могу выбрать любую другую кнопку.

Почему это происходит? Каков правильный способ установки отмеченной опции?

radio: function(value, selected_value, name, callback) { 
    console.log("radio"); 
    console.log(value===selected_value); 
    return(<label> 
     <input type="radio" name="type" value={value} checked={value===selected_value}/>{name} 
    </label>) 
    }, 

    render: function() { 
    selected_value = "com"; 
    return (
     <div> 
     Options: 
     <br/> 
     {this.radio("cha", selected_value, "CM", null)} 
     <br/> 
     {this.radio("lea", selected_value, "L D", null)} 
     <br/> 
     {this.radio("com", selected_value, "Com", null)} 
     </div> 
    ) 

Сгенерированный HTML:

<div data-reactid=".0"><span data-reactid=".0.0">Options:</span><br data-reactid=".0.1"><label data-reactid=".0.2"> 

<input name="type" value="cha" data-reactid=".0.2.0" type="radio"><span data-reactid=".0.2.1">CM</span></label><br data-reactid=".0.3"><label data-reactid=".0.4"> 

<input name="type" value="l" data-reactid=".0.4.0" type="radio"><span data-reactid=".0.4.1">L D</span></label><br data-reactid=".0.5"><label data-reactid=".0.6"> 

<input name="type" value="com" checked="" data-reactid=".0.6.0" type="radio"><span data-reactid=".0.6.1">Com</span></label></div> 

ответ

1

При ручной установке checked пропеллер, вы создаете Controlled Components, который не будет реагировать на действия пользователя, если явно не определить обработчик onChange событий, чтобы сообщить компоненты, что в когда пользователь взаимодействует с ним.

Я считаю, что вы ищете defaultChecked опоры. Установка этого параметра на true или false вместо этого создаст неконтролируемые компоненты, которые будут нормально реагировать на ввод пользователя, сохраняя при этом поведение, которое вы ищете.