Responsive default dynamic details

I have default details that depend on another support. Since it this.propsdoes not exist inside getDefaultProps(), it seems to me that using getInitialState()both states is the best way to do this.

https://facebook.imtqy.com/react/tips/props-in-getInitialState-as-anti-pattern.html

Is there a better approach?

Button = React.createFactory React.createClass
    getInitialState: ->
    className = undefined
    iconClass = undefined
    label = undefined
    switch @props.type
        when 'save'
            className = 'btn-primary'
            iconClass = 'glyphicon glyphicon-floppy-disk'
            label     = I18n.t('crud.save')
        when 'save_next'
            className = 'btn-success'
            iconClass = 'glyphicon glyphicon-floppy-saved'
            label     = I18n.t('crud.save_new')
        when 'cancel'
            className = 'btn-danger'
            iconClass = 'fa fa-stop'
            label     = I18n.t('crud.cancel')
        else
            className = 'btn-default'
    className: className
    iconClass: iconClass || ''
    label: label || ''

propTypes:
    onClick:     React.PropTypes.func.isRequired
    type:        React.PropTypes.oneOf(['button', 'save', 'save_next', 'cancel'])
    className:   React.PropTypes.string
    title:       React.PropTypes.string
    name:        React.PropTypes.string
    iconClass:   React.PropTypes.string
    label:       React.PropTypes.string
    size:        React.PropTypes.oneOf(['xs', 'sm', 'md', 'lg'])
    disabled:    React.PropTypes.bool
    submit:      React.PropTypes.bool

getDefaultProps: ->
    disabled: false
    className: ''
    label: ''
    size: 'sm'
    submit: false

render: ->
    React.DOM.button
        className: "btn btn-#{@props.size} #{@props.className} #{@state.className}",
        onClick: @props.onClick(),
        type: @state.domType
        title: @props.title,
        name: @props.name,
        disabled: @props.disabled,
        React.DOM.span className: "#{@props.iconClass} #{@state.iconClass}"
        ' '
        @props.label || @state.label
+4
source share
1 answer

I'm afraid not.

getDefaultProps the function is called before the component is instantiated.

This meant that you did not have access to the link thisfrom this place.

0
source

Source: https://habr.com/ru/post/1650310/


All Articles