SHARE
TWEET

Untitled

a guest Oct 28th, 2018 77 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. //UserStore.js
  2. import {
  3.   observable,
  4.   flow,
  5.   configure,
  6.   action,
  7. } from 'mobx';
  8. import apiFetch from '../services/data-service';
  9.  
  10. configure({ enforceActions: true });
  11.  
  12. class UserStore {
  13.   @observable users = [];
  14.  
  15.   fetchUsers = flow(function* fetch() {
  16.     try {
  17.       this.users = yield apiFetch('/users', 'get');
  18.     } catch (e) {
  19.       this.errorMessage = e.message;
  20.     }
  21.   })
  22. }
  23.  
  24. const store = new UserStore();
  25. export default store;
  26.  
  27. //store/index.js
  28. import userStore from './user-store';
  29.  
  30. export default {
  31.   userStore,
  32. };
  33.  
  34. //App.jsx
  35. import React from 'react';
  36. import { Provider } from 'mobx-react';
  37. import AppRouter from './router';
  38. import store from './store';
  39. import 'tachyons';
  40. import './styling/semantic.less';
  41.  
  42.  
  43. const App = () => (
  44.   <Provider {...store}>
  45.     <AppRouter />
  46.   </Provider>
  47. );
  48.  
  49. export default App;
  50.  
  51. //containers/Users/index.jsx
  52. import React, { Component } from 'react';
  53. import {
  54.   Segment,
  55.   Button,
  56.   Grid,
  57.   Divider,
  58. } from 'semantic-ui-react';
  59. import { inject, observer } from 'mobx-react';
  60. import PropTypes from 'prop-types';
  61. import styled from 'styled-components';
  62.  
  63. @inject('userStore')
  64. @observer
  65. class Users extends Component {
  66.   static propTypes = {
  67.     userStore: PropTypes.objectOf(PropTypes.oneOfType([
  68.       PropTypes.array,
  69.       PropTypes.object,
  70.       PropTypes.func,
  71.     ])).isRequired,
  72.   }
  73.  
  74.   // componentDidMount() {
  75.   //   const { userStore } = this.props;
  76.   //   userStore.fetchUsers();
  77.   // }
  78.  
  79.   selectUser = (id) => {
  80.     console.log(id);
  81.   }
  82.  
  83.  
  84.   render() {
  85.     console.log('props', this.props)
  86.     // const { userStore } = this.props;
  87.     // const { users } = userStore;
  88.  
  89.     return (
  90.       <Segment>
  91.         users
  92.       </Segment>
  93.     );
  94.   }
  95. }
  96.  
  97. export default Users;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top