These are chat archives for reflux/refluxjs

24th
Sep 2015
Janith Leanage
@janithl
Sep 24 2015 02:08
Hey guys, is there a way to make Reflux work with ListView.DataSource in React Native?
Janith Leanage
@janithl
Sep 24 2015 08:49

Solved it. Updated my Store.js to look like so:

var React = require('react-native');
var Reflux = require('reflux');
var Actions = require('../actions');

var { ListView } = React;

var Store = Reflux.createStore({
    listenables: [Actions],

    init() {
        var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); 

        this.objects = [];
        this.objectlist = ds.cloneWithRows(this.objects);

        fetch('https://www.mysite.com/api/getobjects/').then(function(response) {
            return response.json();
        }).then(this.onSuccess).catch(this.onFail);
    },

    onSuccess(data) {
        this.objects = this.objects.concat(data);
        this.objectlist = this.objectlist.cloneWithRows(this.objects);

        this.trigger(this.objectlist);
    },

    onFail(error) {
        console.log(error);
    }
});

module.exports = exports = Store;

And in my React Native component, added objectlist to the Reflux.connect mixin:

mixins: [Reflux.connect(PlaceStore, "objectlist")],

and used it directly in the ListView :

<ListView dataSource={this.state.placelist} ...

Performance is pretty bad, so I'll post if I stumble upon any updates.

Sorry, that last line of code should read
<ListView dataSource={this.state.objectlist} ...
Frank Gutierrez
@dearfrankg
Sep 24 2015 23:02
wondering how to get semantic-sidebar working with react/reflux