简体   繁体   English

Redux 形式<field />类型道具不适用于复选框或收音机

[英]Redux-form <Field /> type prop not working for checkbox or radio

Hi I'm new to redux forms and I wanted to know how do I use input types other than "text".嗨,我是 redux forms 的新手,我想知道如何使用“文本”以外的输入类型。 I went through the documentation but anything other than type "text" and "email" is not working.我浏览了文档,但除了键入“文本”和“电子邮件”之外的任何内容都不起作用。 For example, I want to use a type="checkbox" or "radio" but they do not appear on the browser output.例如,我想使用 type="checkbox" 或 "radio" 但它们没有出现在浏览器 output 上。 I'm not sure what am I doing wrong here and what exactly is broken that they do not work.我不确定我在这里做错了什么以及它们无法正常工作的确切原因。 Any help would be highly appreciated.任何帮助将不胜感激。

Here is my reducers/index.js file这是我的 reducers/index.js 文件

import {combineReducers} from 'redux';
import { reducer as reduxForm } from 'redux-form';
import dummyReducer from './dummyReducer';

export default combineReducers({
  dummyReducer: dummyReducer,
  form: reduxForm
});

Here is my React component I'm using redux form in这是我使用 redux 形式的 React 组件

import React, { Component } from 'react';
import { reduxForm, Field } from 'redux-form';

class ServiceList extends Component {

  render () {
    return (
      <div>
        <label htmlFor="employed">Employed</label>
        <Field name="projectOwner" component="input" type="radio" />
      </div>
    );
  }
}

export default reduxForm({
  form: 'projectForm'
})(ServiceList);

Input fields with the type text (if used) are shown on the output but checkboxes and radio buttons are not working only the label I used for them appear.带有文本类型(如果使用)的输入字段显示在 output 上,但复选框和单选按钮不起作用,只有我用于它们的 label 出现。 I apologize if there is some type of beginner level error here that it is not rendering.如果这里有某种类型的初学者级别错误,我很抱歉,它没有呈现。

You have to add value="some-text" property.您必须添加 value="some-text" 属性。 Please try this code.请尝试此代码。

<Field name="projectOwner" value="some-text" component="input" type="radio" />
<Field name="projectOwner" value="another-text" component="input" type="radio" />

It was all because of Materialize CSS library that I was using on top of my plain old form.这完全是因为我在普通旧表单之上使用了 Materialize CSS 库。 They have a separate syntax in order for checkbox or radio buttons to appear on the output.它们具有单独的语法,以便复选框或单选按钮出现在 output 上。 I just wanted to put this here if someone out there ran into the same beginner level issue.如果有人遇到同样的初学者级问题,我只是想把它放在这里。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM