FlatList Mobx ReactNative отсутствует опция для вычислений: получить - PullRequest
Новая
       11

FlatList Mobx ReactNative отсутствует опция для вычислений: получить

0 голосов
/ 04 апреля 2019

Когда я нажимаю кнопку добавления элемента, я вижу журналы, в которых был добавлен элемент, но представление не перерисовывается.

Мой магазин: 

import {observable, action, computed} from 'mobx';

export default class ObservableItemStore {
  @observable items = ["Item A", "Item B"];

  @computed get myItems() {
    return this.items;
  }

  @action addItem(item)) {
    console.log("Adding to" + this.items);
    this.items.push(item);
  }
}

import React, {Component} from 'react';
import {Button, FlatList, StyleSheet, Text, View} from 'react-native';
import { observer } from 'mobx-react';
import { Observer } from 'mobx-react/native';
import { Items } from '../../stores';
interface Props {}

@observer
class List extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
        <Button
          title="Add Item"
          onPress={() => {
            Items.addItem("Foo");
          }}
        />
        <Observer>{() => {
          return <FlatList
            data={ Items.items }
            renderItem={({item}) => <Text>{item}</Text>}
          />
        }}
        </Observer>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

export default List;

Почемуразве представление не перерисовывается?

1 Ответ

0 голосов
/ 04 апреля 2019

Вы должны использовать одно из свойств массива в рендере (items.slice (), items.map (), items.length и т. Д.).

https://mobx.js.org/best/react.html#incorrect-use-an-observable-but-without-accessing-any-of-its-properties

...