Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
Rajat Bhardwaj
@rajatb94
can not dispatch ... a store is already dispatching..... tried to use waitFor but no solution
@sanjaysamant Check actions bindings in store and and do the same if u r usinf ALT source
Jovica Aleksic
@loopmode
@rajatb94 waitFor is for something different actually
what you might need is someAction.defer() instead of someAction().
In my experience, the problem is typically:
  • Some component calls componentDidMount() { MyStore.loadSomething(); }
  • loadSomething dispatches a loading action, e.g. via dataSource, to indicate busyness
  • But some other action, probably some success hat caused the component to be mounted in the first place, and it being mounted is still part of the success dispatch and while that hasn't finished, the system is trying to dispatch the next loading action
  • The solution for me is typically componentDidMount() { setTimeout(() => MyStore.loadSomething()); }
Siyabonga Nzulwana
@SiyabongaNzulwana
Hello Guys, I have a problem with my React Component,
Ok, this is how it goes... I have a SearchComponent for searching your address then I have a MapComponent for displaying a map. now I need to have my SearchComponent allowing a user to put his/her address then click submit then the map location changes to the input address, and my SearchComponent needs to have Googles AutoComplete fro places,
any Idea?
Siyabonga Nzulwana
@SiyabongaNzulwana
this is my SearchComponent
import React, { Component } from 'react'
import { MapContainer } from '../Map/MapContainer.jsx'
import Geosuggest from 'react-geosuggest'

export class SearchAddress extends Component {
  constructor (props) {
    super(props)

    this.state = {
      address: ''
    }
     this.handleSubmit = this.handleSubmit.bind(this)
  }

handleSubmit(e) {
e.preventDefault()
   console.log('value ',this.refs.srch.value)

}

onChange(){

}

    render() {

    return (
        <div>
              <form onSubmit={this.handleSubmit}>
            <input size="35" ref="srch" type="search" id="search" placeholder="Search..." />
            <button submit={this.handleSubmit} >Serach Address</button>
            </form>
        </div>
      )
       }
}
Peter Kim
@pk1m
@SiyabongaNzulwana For getting your MapContainer to update based off your SearchAddress input, you should be using actions and stores. its pretty simple, your components will listen to your stores. primitive way to do it is have your handleSubmit fire an action with the address. your MapStore would listen to this action and sets address in its state. Your MapComponent will be listening to the MapStore and will rerender with the new address.
Mikhail Sedletsky
@sedletsky
helau bitches
king Ishtiaq
@KingIshtiaq_twitter
Hi
Scott Albertine
@ScottAlbertine
Hey, anyone familiar with using alt.js and npm test together? I'm running into an immediate error where React's default App.test.js no longer works when I have alt.js actions, but my code works in dev and production just fine
specifically, I'm getting this error
and it's due to me using this line:
export default alt.createActions(BusinessesActions)
where businessActions is a standard action class
I've googled all over the place and I have no idea why this code (which is nearly identical to the alt.js tutorial) is causing such a basic issue as not being able to construct an action class, despite it working in production just fine
the only thing I can think of that might be causing it, is that in production, we use webpack, whereas the test doesn't need to
Luis Gallego Hurtado
@luchoct
Hey, I am looking for some example or documentation of unit tests of action functions based on asynchronous code in the way is described in , fetchLocations in Fetching Data page of 'Getting started' guide . The point is that I want to assert whether updateLocation, which is actually a mock function is invoked, when locations are retrieved, and locationsFailed is invoked when promise is rejected. Is someone aware of any example any doc or example somewhere?
Luis Gallego Hurtado
@luchoct
@ScottAlbertine Hi Scott, I got your error sometime ago, and I had to use functions instead of classes:
export function UnwrappedActions() {
  if (!(this instanceof UnwrappedActions)) return new UnwrappedActions();

  this.actionXXX = function(arg1, arg2) {
  };
}
export default Alt.createActions(UnwrappedActions());
Jovica Aleksic
@loopmode
@luchoct Can't you just use ActionListeners?
you set up a listener that invokes your mock, afterwards you can check if it was invoked
Luis Gallego Hurtado
@luchoct
@loopmode Great, I will give it a shot! I was not aware of ActionListeners. Thanks a lot.
Augusto Russo
@arcifius
Hello everybody... I'm having an issue and hope you could bring me some light...
I'm creating an action like this "async myaction() { const x = await axios.get("/testing"); return x.data }"
the store never gets updated with onMyAction
what am i doing wrong?
Albert Villaroman
@avdeveloper
@arcifius do you have a gist ?
Augusto Russo
@arcifius
nope
@avdeveloper i've created one, dont know how to handle it properly yet
this solves? https://gist.github.com/arcifius/b17c0378fbef50174f0190235074774f
now i've pasted it here i've got why u ask hahaha
i'm going to update that
Augusto Russo
@arcifius
updated
Albert Villaroman
@avdeveloper
@arcifius you need to dispatch() within the action. You can find an example at the bottom of this page

But usually for async requests, I create a Data Source that I would bind to MyStore so that my action function would look like this:

updateParticipants() {
    this.dispatch();
    MyStore.fetchParticipants();
}

The source file would be named something like MySource and it would dispatch an action like updatedParticipants(response) which the store would listen to for updated data.

Albert Villaroman
@avdeveloper
@goatslacker what's that new branch alt2?
Albert Villaroman
@avdeveloper
is there a way to get alt stores from window['alt.js.org'] in production?
Augusto Russo
@arcifius
@avdeveloper i'm going to try that, thanks for the hint!
Joe Shelby
@acroyear

Subject: NPM vs github and cyclical dependencies?

I'm trying to build them from source and completely remove any reference to the FB flux dispatcher entirely. The "BSD+Patents" has not been changed for flux at all (and by holding to the older version, it means holding to an older version of fbjs which also has not been re-licensed the way 0.8.16 has). This is a blocker for my project; I'm only allowed MIT items.

And in trying to run the tests of the other items (utils, container), I'm finding dependency issues.

The npm package of 0.18.6 seems to include some of alt-utils and AltContainer in it. This allows the github drop of the separate alt-utils to have access to AltContainer. However, if I instead point my alt-utils to my local copy of alt (necessary because again I don't want that flux to ever be downloaded), those files are missing. They're in npm but not github for plain 'alt'.

This means I can't fully run the unit tests of alt-utils to be sure I've not broken anything with my alternate dispatcher. It is also worrysome in that by installing both alt and alt-container from npm, I'm getting two copies of alt-container and not sure if I'm actually running the most stable version.

Any comments on how I could deal with this?

Akash Vishwakarma
@akashishu777
What is the use of Alt js ?
Karan Kotwal
@kkotwal94
its similar to that of redux homie
its a react flux implementation
I was like 18 when I wrote this pls no flamerino
I thought the api was really straightforward for a newcomer.
Ash McConnell
@AshMcConnell
Hi Folks, I'm just looking at the tutorial now, one bit I don't get, are the action constants like LocationActions.UPDATE_LOCATIONS automatically generated somehow
Joe Shelby
@acroyear
there is a method generateActions that does that. depending on how the action is 'scoped' it may be under alt.actions.globalactions or alt.actions.myactionclass.actions usually the latter

class CredentialsActions {
constructor() {
this.generateActions('saveCredentials', 'doLogin');
}
}

export default alt.createActions(CredentialsActions);

those two together produce alt.actions.CredentialsActions.saveCredentials and doLogin for me. that wraps all the picky details about SAVE_CREDENTIALS so i don't have to deal with it.