当我尝试将colSpan ="2"属性添加到下面的ReactJS TypeScript代码时,我收到错误" Type string is not assignable to type number " .我怎样才能解决这个问题？
class ProductCategoryRow extends React.Component<MyProps, MyState> {
constructor(props: MyProps) {
super(props);
}
render() {
return (<div>
<tr><th colSpan="2">{ this.props.category }</th></tr>
</div>);
} //end render.
} //end class.
我正在尝试创建一个可重用的ReactJS按钮组件,并需要有关如何将函数传递给组件然后将其用作单击事件的帮助.按钮上的单击事件不起作用.
以下是调用组件的代码:
export var MyPublicFunction = function (inArg: number) {
alert(inArg);
}
ReactDOM.render(<MyButton name="My Button" clickFunction={MyPublicFunction(1)} >Button</MyButton>, document.getElementById('content'));
这是我正在尝试编写的组件:
interface myProps {
name: string;
clickFunction: any
}
class MyButton extends React.Component<myProps, {}> {
constructor(props: myProps) {
super(props);
}
render() {
return (<div>
<button ref="btn1" onClick={this.props.clickFunction} >
{this.props.name}
</button>
</div>);
} //end render.
} //end class.
将ReactJS与TypeScript一起使用时,最好是在构造函数中初始化类变量,还是在声明类变量时？无论哪种方式都可以正常工作,并且转换后的javascript看起来都是一样的.
export class MyClass extends React.Component<iProps, {}> {
private myName: string = "Hello";
constructor(props: iProps) {
super(props);
this.myName= "Hello";
}
}
我一直无法弄清楚如何有条件地关闭现有的 JSX 标记并开始一个新的标记，而不会在 Visual Studio 中出现语法错误。这是怎么做的？在下面的示例中，我想将现有表拆分为两个表。如果我删除条件代码，我不会收到任何语法错误。
<table>
<thead>
...
</thead>
{true ?
</table> /* Close first table (Syntax error on this line because of no starting tag) */
<table> /* Create a new table by splitting the existing table */
: null}
<tbody>
...
</tbody>
</table>
在打字稿类中，有没有办法对 setter 方法和类属性使用相同的名称？这将使设置和获取值更加一致。例如：
myClass.myValue = "Hello"; //Setter.
var myValue = myClass.myValue; //Getter.
class myClass {
myValue: string;
myValue(inArg: string) {
alert("inArg: " + inArg);
}
}
如何在其他表单组件的顶部显示反应日选择器输入字段的日历覆盖弹出窗口？日历被其他表单组件隐藏.我可以在某处设置某种z-index吗？
<DayPicker.Input
name={this.id}
placeholder="MM/DD/YYYY"
format="M/D/YYYY"
value={this.value}
onDayChange={this.handleDayChange.bind(this)}
dayPickerProps={datePickerProps}
/>
如何在Material-UI FormControlLabel上设置嵌入式字体大小？以下尝试不起作用。
const styles: any = createStyles({
formControlLabel: { fontSize: '0.6rem',
'& label': { fontSize: '0.6rem' } }
});
<FormControlLabel style={styles.formControlLabel}
control={<Checkbox value="Hello" color="primary" />}
label="World"
/>
在Visual Studio 2015 Update 2中的"TypeScript构建 - >模块系统"配置下,模块系统"无"将不会保留.它总是回归到"CommonJS".我在Visual Studio中使用开箱即用的捆绑,而不是CommonJS系统.当它恢复为CommonJS时,我的应用程序将无法运行.为什么这个设置不能留下来???
当我点击我的MDL保存按钮时,我正在禁用该按钮.但是,当按钮被禁用时,工具提示会卡在它下面.有没有办法用代码隐藏MDL工具提示？
<mdl.Button id="save1_Button" buttonType="mini-fab" buttonColor="primary" disabled={true}>Save</mdl.Button>
<div className="mdl-tooltip" htmlFor="save1_Button">
Save
</div>
我在 Typescript 中使用 ReactJS。我需要下面的“构造函数”代码吗？没有它它也能正常工作，我查看了转换后的 JavaScript，它似乎无论如何都会自动添加它。
interface myProps {
children?: any;
}
class MyButton extends React.Component<myProps, {}> {
constructor(props: myProps) { //Needed ???
super(props);
}
render() {
return (<div>
<button>
{this.props.children}
</button>
</div>);
} //end render.
} //end class.
在React类组件中，这对我一直很有效：
let myValue: string = "Hello World";
<Button onClick={this.handleClick.bind(this, myValue)}></Button>
我在React Hooks文档中找到了这种语法，我很喜欢它，但是它并不总是传回一个值：
<Button onClick={handleClick} value={myValue}></Button>
此语法有效，但是很难键入并且看起来很凌乱：
<Button onClick={() => handleClick(myValue)}></Button>
这是与钩子一起使用的另一种方法，但是对我来说似乎很棘手。
<Button onClick={handleClick.bind(null, myValue)}></Button>
我对太多的选择感到困惑。不仅有一些最佳实践方法可以做到这一点？