mobx

问题 I have an axios interceptors and when a user gets forced logged out(because of expired token) I want to go back to my home page. I am not sure how to pass react router to it though. I am using mobx but not sure if that will help me with this problem. export const axiosInstance = axios.create({ baseURL: 'https://localhost:44391/api', timeout: 5000, contentType: "application/json", Authorization: getAuthToken() }) axiosInstance.interceptors.response.use(function (response) { return response; },

问题 I have a RN (0.44.2) mobx (3.1.10) app which uses a FlatList . I'm basically following https://blog.callstack.io/write-react-native-apps-in-2017-style-with-mobx-e2dffc209fcb When using my own store, opposed to the examples, I'm having to use toJS() in order to get the FlastList to render // renders list <FlatList data={this.props.giphyStore.images.toJS()} keyExtractor={(_, i) => i} renderItem={({ item }) => <Text>found the data</Text>} /> // does not render list <FlatList data={this.props

问题 On Step 2 of my web app, an observable string value is assigned inside a MobX store. It is then rendered as a textarea value when the Step 3 component render is triggered. I have been following the React docs at https://reactjs.org/docs/forms.html to handle manual changes to the textarea value but have not been successful. My textarea in the Step 3 functional component (imported from Semantic UI React): <TextArea autoHeight value={ ui_store.final_text_message } className={ textarea_style }

问题 I would like to structure mobx project to look like redux project. Store configuration in one file, actions in another file, maybe some other logic and reactions in third file. Also, what is the best practice? To have one store like redux or more. How would I do that (taking out @action from inside a class and dispatching it from another file). Can anybody give some nice examples of structuring their projects? 回答1: Decorators ( @ ) are a nice way to use MobX with classes, but you can use MobX

问题 So I tried to use MobX with react but I can't figure out why the input doesn't have its value updated. This is the code I have written so far: @observer(['recipeStore']) class App extends Component { render() { return ( <input type="text" value={this.props.recipeStore.og} onChange={(e) => {this.props.recipeStore.og = e.target.value}}/> ); } } class RecipeStore { @observable og; @observable style; constructor() { this.og = 1; this.style = {og_low: 1, og_high: 1, fg_low: 1, fg_high: 1, abv_low:

问题 I am declaring a observable array in the following way in reactjs using mobx @observable cacheditems constructor() { this.cacheditems = [] Now I am retrieving the data from pouch-db when offline as follows: var items = [] db.allDocs({include_docs: true}, function(err, docs) { docs.rows.map((obj, id) => { items.push(obj.doc) }) }) this.cacheditems = items But the data is not set. When I try to get the data for rendering its a empty array. 回答1: When you do this.cacheditems = items you are

问题 I use mobx library. It fit well with ReactJS. I have and observable array like this: @observable items = []; When I add an object in this way, I have no problem and the given object will be observable as expected. let x = { Title: "sample title" } items.push(x); but when I define an strongly typed object (using typescript) export class SampleObject { Title: string; constructor(title: string) { this.Title = title; } } and pushing new object in this way, It won't be observable items.push(new

问题 I am currently trying to implement a mobx storage which I can call from everywhere like so: import {userStore} from '../UserStore.js'; At the end of the file, my export functionality looks as follows: const userStore = new UserStore(); export {userStore}; As I understand, everytime I call the import functionality, the object gets re-created with which multiple files that import UserStore don't share the same variables. However, I want that every file that imports UserStore imports the same

问题 I want to integrate mobx and mobx-persist with react-navigation. I read these articles: [1] https://hackernoon.com/react-navigation-with-mobx-2064fcdaa25b [2] https://blog.callstack.io/write-react-native-apps-in-2017-style-with-mobx-e2dffc209fcb [3] https://github.com/react-navigation/react-navigation/blob/8e8d3d562c9e80616f145f97ffb02dcf2048e67e/docs/guides/Mobx-Integration.md [4] MobX + React Native : way to inject stores [5] MobX - Why should I use `observer` when I could use `inject` when

问题 I try to access some refs in my component. But I have this error in the console. withRouter.js:44 Warning: Stateless function components cannot be given refs (See ref "pseudo" in FormInputText created by RegisterForm). Attempts to access this ref will fail. Here is my component: class RegisterForm extends React.Component { render() { return ( <form action=""> <FormInputText ref="pseudo" type="text" defaultValue="pseudo"/> <input type="button" onClick={()=>console.log(this.refs);} value=