9 常见问题

ES6中函数的绑定问题

比如处理onPress，如何绑定上下文环境。

[推荐]方法一：使用类的属性

class Demo extends Component {

    handlePress=()=>{Modal.alert('onPress')}
    render() {
        return (
            <View style={styles.container}>
                <Button onPress={this.handlePress} >press me</Button>
            </View>
        );
    }
}

方法二：使用Function.prototype.bind

class Demo extends Component {
    handlePress() {Modal.alert('onPress')}
    render() {
        return (
            <View style={styles.container}>
                <Button onPress={this.handlePress.bind(this)} >press me</Button>
            </View>
        );
    }
}

方法三：使用在构造函数定义的函数

class Demo extends Component {
    constructor(props) {
      super(props);
      this.handlePress = this.handlePress.bind(this);
    }
    handlePress() {Modal.alert('onPress')}
    render() {
        return (
            <View style={styles.container}>
                <Button onPress={this.handlePress} >press me</Button>
            </View>
        );
    }
}

display是不是只只支持flex属性

是，目前仅仅支持flex属性。

Nuke：Input组件 onChange在Android下不触发

目前由于兼容性问题，在Android下只有该组件失去焦点的时候才会触发，后续会保证三端统一。

样式：1rem和实际不一致

目前由于兼容性问题，1rem会被解析成2px

如何实现display: none类似效果

由于display只支持flex，不能使用display: none达到隐藏View效果。在QAP下，可以使用下面类似的代码达到目的：

class Demo extends Component {

    renderName() {
        if (false) {
            return (<Text>我不会出现</Text>)
        }
    }
    render() {
        return (
            <View style={styles.container}>
                {this.renderName()}
            </View>
        );
    }
}

TouchableHighlight组件没有视觉效果

该组件暂时没有视觉效果，后续会开放出来

使用qap debug命令运行qap工程时，点debugger和不惦记debugger，效果不一样

由于不点击debugger时，使用的是移动端的JS引擎，点击debugger后，使用的是PC浏览器的引擎。由于两端的引擎有差异性，通常来说PC的JS引擎健壮性比移动端的要好，因此造成调试模式下可以运行，非调试模式下无法运行的问题。目前QAP已经尽可能的通过polyfill抹平端的差异性，但还是会面临该问题。下面列举下可能导致差异性的问题

1.自己编写的代码中有语法错误。 2.使用了不支持的属性、方法或者语法。

使用移动端扫码调试时，不显示连接的设备

刷新浏览器即可

如何查看千牛运行时日志

使用千牛扫码调试，点击inspect即可查看日志