我可以在 React Native 中使用 Backbone 吗？

Question

我在网络上发现了几个将 React (View) 与 Backbone 集成的不同示例，但没有找到与 React Native 相同的示例。我想知道这是否可行，以及是否有任何样本可供使用。

这个（https://github.com/magalhas/backbone-react-component）似乎也是一个很好的起点，但由于我没有任何知识，我不确定它是否仍然可以在 React Native 中使用。

谢谢。

Answer 1

您将能够使用 Backbone 的某些部分，是的。

Backbone 的视图在 Web 浏览器中的 DOM 上运行，并且由于 React Native 没有，您将无法使用 Backbone 视图作为-是。

但是，请注意 Backbone.React.Component 被描述为 "a mixin that glues Backbone models and collections into React components"。因此它作为您应用程序的数据层，为您的视图提供数据。

这在理论上很有用，但在实践中我刚刚尝试过，但实际上并没有用！也就是说，我确实设法调整了 Backbone.React.Component 的代码来修复它，并且这个演示有效：

'use strict';

var React = require('react-native');
var Backbone = require('backbone');
var backboneMixin = require('backbone-react-component');

var {
    AppRegistry,
    StyleSheet,
    Text,
    View,
} = React;

var MyComponent = React.createClass({
    mixins: [backboneMixin],
    render: function () {
        return <Text>{this.state.model.foo}</Text>
    }
});

var model = new Backbone.Model({foo: 'bar'});
model.set('foo', 'Hello world!');

var ReactNativeBackbone = React.createClass({
    render: function() {
        return (
        <View>
            <MyComponent model={model} />
        </View>
        );
    }
});

AppRegistry.registerComponent('ReactNativeBackbone', () => ReactNativeBackbone);

您会看到模型中 foo 的值在屏幕上显示为 "Hello world!"。您需要像这样编辑 Backbone.React.Component 中的 lib/component.js：

diff --git a/node_modules/backbone-react-component/lib/component.js b/fixed.js
index e58dd96..0ca09f7 100644
--- a/node_modules/backbone-react-component/lib/component.js
+++ b/fixed.js
@@ -32,7 +32,7 @@
   if (typeof define === 'function' && define.amd) {
     define(['react', 'backbone', 'underscore'], factory);
   } else if (typeof module !== 'undefined' && module.exports) {
-    module.exports = factory(require('react'), require('backbone'), require('underscore'));
+    module.exports = factory(require('React'), require('backbone'), require('underscore'));
   } else {
     factory(root.React, root.Backbone, root._);
   }
@@ -70,11 +70,11 @@
     },
     // Sets `this.el` and `this.$el` when the component mounts.
     componentDidMount: function () {
-      this.setElement(React.findDOMNode(this));
+      //this.setElement(React.findDOMNode(this));
     },
     // Sets `this.el` and `this.$el` when the component updates.
     componentDidUpdate: function () {
-      this.setElement(React.findDOMNode(this));
+      //this.setElement(React.findDOMNode(this));
     },
     // When the component gets the initial state, instance a `Wrapper` to take
     // care of models and collections binding with `this.state`.

我做了两处修改：

需要 React 而不是 react
删除对 findDOMNode

我没有进行任何广泛的测试，但这应该可以帮助您入门。我还 opened an issue 尝试在主要 Backbone.React.Component 代码库中解决问题。

Answer 2

看看这个：react-native-backbone

我可以在 React Native 中使用 Backbone 吗？

Can I use Backbone with React Native?

javascript

ios

backbone.js

reactjs

react-native