反應在進口分類後放一些道具

Question

我的反應網站有問題。 我有我出口

class Input extends React.Component { 
    render() { 
    const CustomMapping = [ 
     ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p'], 
     ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l', '@'], 
     ['z', 'x', 'c', 'v', 'b', 'n', 'm', '.com'] 
    ]; 

    return (
     <KeyboardedInput 
     enabled 
     type={this.props.type} 
     value={this.props.value} 
     name={this.props.name} 
     defaultKeyboard={CustomMapping} 
     /> 
    ); 
    } 
} 
export default Input; 

一類，我將其導入以其他文件，我不知道我怎麼可以添加一些道具來完成它。

請幫幫我！ :) 有一個良好的白天或晚上;）

Answer 1

如果我正確理解你的問題，你想添加一些額外的道具給你輸入？ 或者你只是想通過預期的道具？

class Input extends React.Component { 
    render() { 
    const CustomMapping = [ 
     ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p'], 
     ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l', '@'], 
     ['z', 'x', 'c', 'v', 'b', 'n', 'm', '.com'] 
    ]; 

    const { type, value, name, ...extraProps } = this.props; 

    return (
     <KeyboardedInput 
     enabled 
     type={type} 
     value={value} 
     name={.$name} 
     defaultKeyboard={CustomMapping} 
     {...extraProps} 
     /> 
    ); 
    } 
} 
export default Input; 

在你輸入的輸入組件，只需添加它們作爲普通道具：

class Whatever extends React.Component { 
    render() { 

    return (
     <Input 
     type={'input'} 
     value={'abc'} 
     name={'email'} 
     color={'green'} 
     /> 
    ); 
    } 
} 
export default Whatever; 

Answer 2

在其他文件中稱其爲

<Input type="input" value="abc" name="email" /> 

而且，一個構造函數添加到輸入文件

constructor(props) { 
    super(props); 
}