android - 创建新的 Realm 对象后导航出错

Question

我在我的项目中使用了 react-native-navigation 包和 Realm。我的应用程序有一个名为 Notebook 的 Realm 对象其中包含 Verse 的列表对象，这是另一个 Realm 对象。

应用程序的结构非常简单，第一页显示一个列表 Notebook s，当选择其中一个时，应用程序会转到第二个屏幕，该屏幕是 Verse 的列表。

这是我从笔记本列表导航到诗歌列表的代码:

this.props.navigator.push({
  screen: 'com.beyersapps.biblebinderrn.verselist',
  title: notebook.name,
  passProps: {notebook: notebook},
  animated: true,
  animationType: 'fade',
  backButtonTitle: undefined,
  backButtonHidden: false
})

这个导航工作正常，我可以在两个屏幕之间来回移动。当我创建一个新的 Verse 时，我的问题就来了并将其添加到 Notebook .这是我在第二个屏幕中创建新 Verse 的代码:

realm.write(() => {
  let newVerse = realm.create('Verse', {
    reference: 'Genesis 1:1',
    favorite: false,
    memorized: false,
    scripture: 'My favorite verse'
  });

  if (this.notebook != null) {
    this.notebook.verses.push(newVerse);
  }
});

这是我的问题开始的地方。此时，如果我选择后退按钮返回到 Notebook 的列表s，然后再次选择一个笔记本，我得到这个错误:

Attempting to change value of a readonly property.

Exception in native call java.lang.RuntimeException: Error calling RCTEventEmitter.receiveTouches

at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
at android.os.Looper.loop(Looper.java:154)
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:199)
at java.lang.Thread.run(Thread.java:761)
Caused by: com.facebook.jni.CppException: Exception calling object as function: TypeError: Attempting to change value of a readonly property.
at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method) 
at android.os.Handler.handleCallback(Handler.java:751) 
at android.os.Handler.dispatchMessage(Handler.java:95) 
at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31) 
at android.os.Looper.loop(Looper.java:154) 
at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:199) 
at java.lang.Thread.run(Thread.java:761) 

我可以做几件事来解决这个问题，但两者都会让我的应用变得无用。因为他们可能有助于确定问题，但我可以删除 {notebook: notebook}来自 passProps当我导航到新屏幕时(但是 Verse 列表屏幕上没有任何显示，因为它不知道选择了哪个 Notebook)。或者，我无法添加新创建的 Verse到选定的Notebook (但后来我无法添加数据)。

由于这两个更改在两个不同的组件(Realm 和 react-native-navigation)中，我不确定哪个组件是问题的根源。

Answer 1

作为 props (passProps) 传递的对象被 React Native 卡住。尝试更改:

passProps: {notebook: notebook}

到:

passProps: {notebook: _.cloneDeep(notebook)}

如果您需要在上一个屏幕中反射(reflect)对notebook 的更改，我认为您应该通过商店这样做。

另一种选择是传递 notebookId 并通过 id 从 state 获取正确的笔记本。