RNI 和 Expo (Snack) 中 Animated.Value 的不同值

Question

我在 RNI 和 Expo Snack Application 中得到不同的 Animated.Value 结果。

我创建了一个新的 RNI 应用程序。在 App.js 中，我在构造函数中添加了一个新的 Animated.Value，然后我在 render 方法中添加了 console.log。

控制台结果是：

Animated Value:  AnimatedValue {_children: Array(0), _value: 0, _startingValue: 0, _offset: 0, _animation: null, …}

当我在 Expo Snack 中做同样的事情时，控制台结果是：

Animated Value: 0

这是为什么？如何访问我的 RNI 应用程序中的值？甚至在 react-native 文档中也使用了该模式。所以我有点惊讶。我在监督什么吗？

这里是代码 auf die App.js：

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

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' +
    'Cmd+D or shake for dev menu',
  android: 'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

type Props = {};
export default class App extends Component<Props> {
  constructor(props) {
    super(props);
    this.state = { left: new Animated.Value(0) };
  }

  render() {
    console.log('Animated Value: ', this.state.left);
    return (
      <Animated.View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit App.js
        </Text>
        <Text style={styles.instructions}>
          {instructions}
        </Text>
      </Animated.View>
    );
  }
}

Answer 1

Expo Snack SDK 中提到的一个，flowTypes 用于错误、日志和存在侦听器已被定义为提到的here

// `console.log`, `console.warn`, `console.error`
export type ExpoDeviceLog = {
  device: ExpoDevice,
  method: 'log' | 'warn' | 'error',
  message: string,
  arguments: any, // the raw fields that were passed to the console.* call
};

从flowTypes 来看，由于他们期望消息为String，因此它显示为一个值而不是一个对象。 如果您登录

    const animated = new Animated.Value(0)
    console.log(JSON.stringify(animated))

你会得到同样的结果。