Тег Formik не отображается в просмотре карты - PullRequest
Новая
       103

Тег Formik не отображается в просмотре карты

0 голосов
/ 12 апреля 2020

Я создаю приложение с помощью Reactnative, и там у меня есть форма в карточке. Карточка от React-Native-Element, форма от Formik, поэтому я могу сделать с ней проверку, потому что я новичок в React-Native, я не знаю почему, но когда я использую formik, моя форма не отображается в моем cardview, но когда я использую Forms из native-base, он работает без проблем. Я использую expo для запуска моего приложения, там нет ошибки, по крайней мере, не ошибка, которую я понимаю. Может ли кто-то, возможно, взглянуть на это и дать мне указатель

Мой код 

 <Card title="Listen Name">
    <View style={{ flexDirection: "row" }}>
      <View>
        <TouchableOpacity style={styles.imagePicker}>
          <Icon name={"image"} size={30} color="#01a699" />
        </TouchableOpacity>
      </View>
      <View>
        <Text style={{ marginTop: 30, marginLeft: 30 }}>
          Optionale Eingabe Bild
        </Text>
      </View>
    </View>
    <View>
      <Formik>
        <Form>
          {" "}
          <Input
            placeholder="Listen Name hinzufügen"
            rounded
            right
            icon="list"
            family="Feather"
            iconSize={25}
            iconColor="black"
          />
          <Input
            placeholder="Mitglieder Hinzufügen"
            rounded
            right
            icon="team"
            family="antdesign"
            iconSize={25}
            iconColor="black"
          />
        </Form>
      </Formik>
    </View>
    <Divider />

    <View style={{ marginLeft: 120, flexDirection: "row" }}>
      <View>
        <Button
          round
          uppercase
          color
          color="error"
          style={styles.button2}
          onPress={() => props.navigation}
        >
          <Label style={(styles.font, styles.buttonText)}>Abbrechen</Label>
        </Button>
      </View>
      <View>
        <Button round uppercase color color="#000" style={styles.button}>
          <Label style={(styles.font, styles.buttonText)}>Speichern</Label>
        </Button>
      </View>
    </View>
  </Card>

Данные журнала 

    Text strings must be rendered within a <Text> component.

Stack trace:
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:4137:14 in <anonymous>
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:4134:2 in createTextInstance
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:15909:12 in completeWork
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19409:28 in completeUnitOfWork
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19380:30 in performUnitOfWork
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19347:39 in workLoopSync
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18997:22 in renderRoot
  [native code]:null in renderRoot
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18709:28 in runRootCallback
  [native code]:null in runRootCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5642:32 in runWithPriority$argument_1
  node_modules\scheduler\cjs\scheduler.development.js:643:23 in unstable_runWithPriority
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5638:22 in flushSyncCallbackQueueImpl
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5627:28 in flushSyncCallbackQueue
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18796:28 in batchedUpdates$1
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2709:30 in batchedUpdates
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2794:17 in batchedUpdates$argument_0
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2870:28 in receiveTouches
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:436:47 in __callFunction
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:111:26 in __guard$argument_0
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:384:10 in __guard
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:110:17 in __guard$argument_0
  [native code]:null in callFunctionReturnFlushedQueue
  ...
ERROR
19:18
Warning: %s: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI., RootErrorBoundary

Stack trace:
  node_modules\react-native\Libraries\YellowBox\YellowBox.js:63:8 in console.error
  node_modules\expo\build\environment\muteWarnings.fx.js:27:24 in error
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:645:36 in warningWithoutStack
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18056:16 in callback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:7595:16 in callCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:7639:19 in commitUpdateEffects
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:7630:22 in commitUpdateQueue
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:17116:10 in commitLifeCycles
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:20002:23 in commitLayoutEffects
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:307:15 in invokeGuardedCallbackImpl
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:531:36 in invokeGuardedCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19768:10 in commitRootImpl
  [native code]:null in commitRootImpl
  node_modules\scheduler\cjs\scheduler.development.js:643:23 in unstable_runWithPriority
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:19590:4 in commitRoot
  [native code]:null in commitRoot
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18709:28 in runRootCallback
  [native code]:null in runRootCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5642:32 in runWithPriority$argument_1
  node_modules\scheduler\cjs\scheduler.development.js:643:23 in unstable_runWithPriority
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5638:22 in flushSyncCallbackQueueImpl
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5627:28 in flushSyncCallbackQueue
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18796:28 in batchedUpdates$1
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2709:30 in batchedUpdates
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2794:17 in batchedUpdates$argument_0
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:2870:28 in receiveTouches
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:436:47 in __callFunction
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:111:26 in __guard$argument_0
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:384:10 in __guard
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:110:17 in __guard$argument_0
  [native code]:null in callFunctionReturnFlushedQueue
  ...

1 Ответ

0 голосов
/ 13 апреля 2020

https://codesandbox.io/s/react-native-formik-cardview-test-i9yrb?file= / src / App. js

Проверьте этот код и ящик, который я написал для вашего кода. Я думаю, это работает. Правильно ли вы импортировали модули?

...