React Native 一個組件styles BUG

標籤：

‘use strict‘;var React = require(‘react-native‘);var {  StyleSheet,  PanResponder,  View,  Text} = React;var CIRCLE_SIZE = 40;var PanResponderExample = React.createClass({componentWillMount: function() {  this._panResponder = PanResponder.create({  onStartShouldSetPanResponder: ()=>true,  onMoveShouldSetPanResponder: ()=>true,  onPanResponderGrant: ()=>{},  onPanResponderMove: this._handlePanResponderMove,  onPanResponderRelease: ()=>{},  onPanResponderTerminate: ()=>{},  });  this._previousLeft = 20;  this._previousTop = 84;  this._circleStyles = {  left: this._previousLeft,  top: this._previousTop,  };},render: function() {  return (  <View style={{backgroundColor: ‘#6495ed‘,flex: 1}}>  <View style={[styles.circle,this._circleStyles]}        {...this._panResponder.panHandlers} />  <Text style={ styles.bottomText}>    _previousLeft: {this._previousLeft},        _previousTop: {this._previousTop},    left: {this._circleStyles.left},    top: {this._circleStyles.top}  </Text>  </View>  );},_handlePanResponderMove: function(e: Object, gestureState: Object) {  //**can‘t apply style left&top  //this._circleStyles.left = this._previousLeft + gestureState.dx;  //this._circleStyles.top = this._previousTop + gestureState.dy;  //**can apply style left&top  this._circleStyles = {    left: this._previousLeft + gestureState.dx,    top: this._previousTop + gestureState.dy  };  this.setState();}});var styles = StyleSheet.create({circle: {  width: CIRCLE_SIZE,  height: CIRCLE_SIZE,  borderRadius: CIRCLE_SIZE / 2,  backgroundColor: ‘blue‘,  position: ‘absolute‘}});module.exports = PanResponderExample;

 

在函數_handlePanResponderMove中使用：

  this._circleStyles.left = this._previousLeft + gestureState.dx;  this._circleStyles.top = this._previousTop + gestureState.dy;

 

組件樣式<View style={[styles.circle,this._circleStyles]}>

沒有發生變化,必須使用

  this._circleStyles = {    left: this._previousLeft + gestureState.dx,    top: this._previousTop + gestureState.dy  };

環境react 0.14.0 winx64

先記錄問題再研究

React Native 一個組件styles BUG