ヘルパーメソッドgetLayout（）を使用すると、エラーがスローされます

Question

コードに何が問題なのかよくわかりません。私は、アニメーションされる要素の私の位置を得るためにヘルパーメソッドgetLayout()を使用しています。デフォルトでは、この文書のhttp://browniefed.com/react-native-animation-book/api/GETLAYOUT.html.に従ってValueXYに存在する必要があります。

一部のヘルプと説明は大歓迎です。

import React, { Component } from 'react'; 
import { View, Animated } from 'react-native'; 

class Ball extends Component { 
    conponentWillMount() { 
    this.position = new Animated.ValueXY(0,0); 
    Animated.spring(this.position, { 
     toValue: { x: 200, y: 500 } 
    }).start(); 
    } 

    render() { 
    return (
     <Animated.View style={this.position.getLayout()}> 
     <View style={styles.ball} /> 
     </Animated.View> 
    ); 
    } 

} 

const styles = { 
    ball: { 
    height: 60, 
    width: 60, 
    borderRadius: 30, 
    borderWidth: 30, 
    borderColor: 'red' 
    } 
} 

export default Ball;`enter code here` 

Answer 1

ちょうどタイプミス - conponentWillMount - >componentWillMountです。これにより初期化ができなくなり、this.positionが未定義となり、エラーがthis.position.getLayoutになりました。