0

我将 Reaniamted v2 与 expo 项目一起使用。我在网上看过很多教程,下面的示例没有错误,但是当我尝试在我的应用程序中使用代码作为学习实践时,我收到错误“尝试从不同的线程同步调用函数 {inOut}。解决方案是: a) 如果你想同步执行这个方法,标记为 Worklet b) 如果你想在 JS 线程上执行这个方法,使用 runOnJS 包装”

该错误是由放置在 x 翻译上的“withTiming(animation.value.....”钩子引起的,在我看过的所有视频中,都允许使用钩子。如果我没有,为什么我会收到这个错误滥用它?

import { View, StyleSheet, TouchableWithoutFeedback } from 'react-native'
import React from 'react'
import Animated, {
    useSharedValue,
    useAnimatedStyle,
    withTiming,
} from 'react-native-reanimated'

const Transitions = () => {
    const animation = useSharedValue(0)

    const animationStyle = useAnimatedStyle(() => {
        return {
            transform: [
                {
                    translateX: withTiming(
                        animation.value,
                        {
                            duration: 1000,
                        },
                        () => {
                            animation.value = 0
                        }
                    ),
                },
            ],
        }
    })

    return (
        <View style={styles.container}>
            <TouchableWithoutFeedback
                onPress={() => {
                    animation.value = 200
                }}
            >
                <Animated.View style={[styles.box, animationStyle]} />
            </TouchableWithoutFeedback>
        </View>
    )
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    },
    box: {
        width: 200,
        height: 200,
        backgroundColor: '#631d94',
    },
})

我还应该提到我只是尝试在一个新项目上安装 reanimated 只是为了再试一次,我收到了以下所有警告。

pm WARN deprecated xmldom@0.1.31: Deprecated due to CVE-2021-21366 resolved in 0.5.0
npm WARN deprecated @hapi/topo@3.1.6: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/hoek@8.5.1: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/bourne@1.3.2: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/address@2.1.4: Moved to 'npm install @sideway/address'
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated @hapi/joi@15.1.1: Switch to 'npm install joi'
npm WARN deprecated core-js@2.6.12: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated uglify-es@3.3.9: support for ECMAScript is superseded by `uglify-js` as of v3.13.0
npm WARN deprecated core-js@1.2.7: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN deprecated deep-assign@3.0.0: Check out `lodash.merge` or `merge-options` instead.
npm WARN rm not removing /Users/hb/Desktop/React Native Projects/test2/node_modules/.bin/uuid as it wasn't installed by /Users/hb/Desktop/React Native Projects/test2/node_modules/uuid
npm WARN rm not removing /Users/hb/Desktop/React Native Projects/test2/node_modules/.bin/semver as it wasn't installed by /Users/hb/Desktop/React Native Projects/test2/node_modules/semver
npm WARN rm not removing /Users/hb/Desktop/React Native Projects/test2/node_modules/.bin/mime as it wasn't installed by /Users/hb/Desktop/React Native Projects/test2/node_modules/mime
npm WARN rm not removing /Users/hb/Desktop/React Native Projects/test2/node_modules/.bin/json5 as it wasn't installed by /Users/hb/Desktop/React Native Projects/test2/node_modules/json5

> core-js@3.9.1 postinstall /Users/hb/Desktop/React Native Projects/test2/node_modules/@expo/configure-splash-screen/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js on Open Collective or Patreon: 
> https://opencollective.com/core-js 
> https://www.patreon.com/zloirock 

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)


> core-js@2.6.12 postinstall /Users/hb/Desktop/React Native Projects/test2/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN react-native-reanimated@2.0.0-rc.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN react-native-reanimated@2.0.0-rc.0 requires a peer of react-native-gesture-handler@* but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-object-assign@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN expo-asset@8.2.2 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-file-system@9.3.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-error-recovery@1.4.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN @unimodules/react-native-adapter@5.7.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-font@8.4.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-keep-awake@8.4.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-linking@2.0.1 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-linear-gradient@8.4.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-sqlite@8.5.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN expo-permissions@10.0.0 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN react-native-safe-area-context@3.1.9 requires a peer of react-native@* but none is installed. You must install peer dependencies yourself.
npm WARN @babel/preset-env@7.13.10 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-decorators@7.13.5 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN metro-react-native-babel-preset@0.59.0 requires a peer of @babel/core@* but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-decorators@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/helper-create-class-features-plugin@7.13.10 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-class-properties@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/helper-compilation-targets@7.13.10 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-export-namespace-from@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-async-generator-functions@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-dynamic-import@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-logical-assignment-operators@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-json-strings@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-nullish-coalescing-operator@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-numeric-separator@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-optional-catch-binding@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-object-rest-spread@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-async-generators@7.8.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-optional-chaining@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-private-methods@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-unicode-property-regex@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-dynamic-import@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-class-properties@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-export-namespace-from@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-json-strings@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-nullish-coalescing-operator@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-logical-assignment-operators@7.10.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-numeric-separator@7.10.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-object-rest-spread@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-optional-catch-binding@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-optional-chaining@7.8.3 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-top-level-await@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-arrow-functions@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-block-scoped-functions@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-async-to-generator@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-classes@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-destructuring@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-block-scoping@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-dotall-regex@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-duplicate-keys@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-computed-properties@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-exponentiation-operator@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-for-of@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-member-expression-literals@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-modules-amd@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-function-name@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-literals@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-modules-systemjs@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-modules-commonjs@7.13.8 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-modules-umd@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-named-capturing-groups-regex@7.12.13 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-object-super@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-new-target@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-parameters@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-property-literals@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-regenerator@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-reserved-words@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-spread@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-shorthand-properties@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-sticky-regex@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-typeof-symbol@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-template-literals@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-unicode-escapes@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN babel-plugin-polyfill-corejs2@0.1.10 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/preset-modules@0.1.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-unicode-regex@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN babel-plugin-polyfill-regenerator@0.1.6 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN babel-plugin-polyfill-corejs3@0.1.7 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/helper-create-regexp-features-plugin@7.12.17 requires a peer of @babel/core@^7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/helper-define-polyfill-provider@0.1.5 requires a peer of @babel/core@^7.4.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-export-default-from@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-export-default-from@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-flow@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-flow-strip-types@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-react-jsx@7.12.17 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-react-display-name@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-react-jsx-source@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-react-jsx-self@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-runtime@7.13.10 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-transform-typescript@7.13.0 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-jsx@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-syntax-typescript@7.12.13 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/preset-typescript@7.12.17 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself.

+ react-native-reanimated@2.0.0-rc.0
added 23 packages from 67 contributors, removed 619 packages and updated 467 packages in 50.707s

52 packages are looking for funding
  run `npm fund` for details
4

2 回答 2

0

我运行了代码并且运行良好,你是如何安装和配置复活的?显示你的 package.json 和你的 babel.config.js

于 2021-03-14T19:27:19.337 回答
0

FIXED !

My issue was............. I was using npm and not yarn. Couldn't believe it. I spent an entire day troubleshooting this and I hope that other people running into this issue will be spared those painful hours. Im switching over to yarn for good!

If you're using expo, and using npm install yarn and run the following commands:

  • yarn add react-native-reanimated@2.0.0-rc.0
  • yarn add react-native-gesture-handler
  • rm -r node_modules
  • watchman watch-del-al
  • rm -fr $TMPDIR/metro-cache
  • yarn add core-js@^3
  • yarn
  • expo start -c
于 2021-03-15T04:39:49.863 回答