Redux Form lists an ability to handle custom components: <a href="http://redux-for

Hi <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="

Integration with redux form - help request about react-radioimg HOT 2 OPEN

newbreedofgeek commented on May 21, 2024

Integration with redux form - help request

from react-radioimg.

Comments (2)

newbreedofgeek commented on May 21, 2024

Hi @rklaeboe

I had a quick look at redux-form and it should be pretty easy to use radio-img with it.

readio-img supports 2 params that you can use:

defaultValue and onChange

to (respectively) map to the field.input.value and field.input.onChange(param.val) from the example redux-form example you linked

Make sure defaultValue matches a value from a collection that you feed into options

Here is some e.g code that should get you started.

let smileImgs = [
  require('./img/smile-01.png'),
  require('./img/smile-02.png'),
]

const smileyOptions = [
      {
        btnCls: pnCls,
        btnSelCls: pnClsSel,
        val: '1',
        label: '1',
        img: smileImgs[0]
      },
      {
        btnCls: pnCls,
        btnSelCls: pnClsSel,
        val: '2',
        label: '2',
        img: smileImgs[1]
      }
]

<RadioImg
      ref="areYouHappy"
      options={smileyOptions}
      defaultValue={field.input.value}
      marginSpace="10"
      onChange={(e) => {
        field.input.onChange(e.target.value)
      }}
 />

Hope that helps...

from react-radioimg.