小编mik*_*ang的帖子

我正试图找出一种更简洁的方法来使用箭头键在使用React的输入列表中上下移动焦点.列表是父组件,输入子组件.为了弄清楚接下来应该关注什么输入,我给每个孩子一个ref以及id用于跟踪排序的数字.当检测到箭头键时,回调然后找到具有正确的子项ref并进入该子项refs以获取输入并给予焦点.

我是React的新手,感觉很脏,所以我想知道是否有更清洁的解决方案.

代码和工作jsfiddle:

var Child = React.createClass({
    handleUp: function(e) {
        switch(e.key) {
            case "ArrowDown":
                this.props.handleFocus(this.props.id+1);
            break;
            case "ArrowUp":
                this.props.handleFocus(this.props.id-1);            
            break;
        }
    },
    render: function() {
        return <div><input defaultValue={this.props.name} onKeyUp={this.handleUp} ref="input" /></div>;
    }
});

var Parent = React.createClass({
    handleFocus: function(id) {
        var child = this.refs['child' + id];
        if (!child) return;
        var input = child.refs.input;
        input.getDOMNode().focus();
    },
    render: function() {
        var inputs = [];
        for (var i=0; i<10; i++) {
            inputs.push(<Child key={i} id={i} name={"value" …

可能重复:
iPhone Safari:检查javascript是否支持URL方案？

我正在使用pic2shop为移动网络应用程序提供条形码扫描.对于iOS,可以检查[canOpenURL]以查看特定方案是否有效(tel://,pic2shop://).移动浏览器(iOS,Android等)中是否有提供相同功能的东西？