2017-01-04 4 views
0

У меня есть компонент, который динамически получает разные реквизиты. Как показать это с помощью propTypes? Я думал, что-то вроде этого -Два набора React propTypes

export default class Component extends React.Component { 
    static propTypes = { 
    propsOne: PropTypes.object, 
    }; 
// OR 
    static propTypes = { 
    propsTwo: PropTypes.object, 
    }; 
    // ... 
} 
+0

Я думаю [этот ответ] (http://stackoverflow.com/a/33982256/1301872) может помочь. –

ответ

1

Вы можете использовать пользовательский валидатор, с одним уровнем абстракции для указания имен гребного винта

// Generate a custom React validation function 
function eitherProp(prop1, prop2) { 
    return (props, propName, componentName) => { 
     const hasProp1 = typeof props[ prop1 ] === 'object'; 
     const hasProp2 = typeof props[ prop2 ] === 'object'; 

     // If both are provided, or neither, error 
     if((hasProp1 && hasProp2) || !(hasProp1 || hasProp2)) { 
      return new Error(`Please provide either ${prop1} or ${prop2} of type object, not both`); 
     } 
    }; 
} 

// Generate a reusable function for both props 
const propsOneOrTwo = eitherProp('propsOne', 'propsTwo'); 

static propTypes = { 
    propsOne: propsOneOrTwo, 
    propsTwo: propsOneOrTwo 
}; 
3

Вы можете использовать существующий React.PropTypes.oneOfType API для достижения этой цели. Вы бы использовать его как:

static propTypes = { 
    propOne: React.PropTypes.oneOfType([ 
     React.PropTypes.string, 
     React.PropTypes.number 
    ]), 
    ... 
}; 

Однако, если ваш тип проверка требует логики, вам, возможно, придется пойти с ответом Энди. Но если ваша проверка типов требует более сложной логики, чем «эта поддержка может быть одной из нескольких типов», вам может потребоваться пересмотреть логику выше стека, чтобы это не требовалось.