I have a small application in react-native with two components.
on Navigating to a component twice this gives me error for setState function.
Anybody have idea about this .
I am using native base as an starter kit for my project.
the only change I did is I have seperated the UI render part in different js file.
Thanks in advance.
this has something to do with your render function.
the setstate function gives error when there is no such state variable available.
may be on navigating again to that same screen it is giving you a new state for that page instead of the previous state.
Please check your render function.
Related
I'm currently working on a sample application to learn Kotlin/Js with the react library. When using the normal JSX syntax, a component can be set to be triggered when a specific URL hits using the BrowserRouter & Route API like below.
Main Component
Navigation Component as directed like in this youtube video
When attempting the above code in Kotlin, it resembles something like the screenshot below using the KotlinDSL
The main function where the component is rendered is shown below
However, that creates an Uncaught Error Exception like the one below
One of the reasons its also so difficult to debug is because my source maps dont work and hence most of my debugging errors are actually in Javascript. But anyways after searching up the javascript error, I found this article about the new Router update that disallows adding components as children.
As a result I tried to pass in the components through the element prop but there seems to be some incompatibility with them.
the element prop accepts an optional ReactNode? and I cant seem to convert my Function Component of type props to a ReactNode. When I try to pass in an optional ReactElement? by calling the create method, I also get an error.
I have been struggling with the Kotlin Documentation and can't seem to find enough examples of react-router implemented.
Can anyone help me out with how to pass in a Function COmponent into the element prop for the React Router?
I have two functions. My First.js function has two state variables that I want to send to Second.js . I have tried sending data using Stack Navigation route params but it keeps on saying
"undefined is not an object route.params.firstVariable"
How would I send data without using navigation?
If the functions/components are mounted on different screens, you will have to pass them through the navigator. If they are on the same screen, you can pass them as props.
Share the code if you still have an issue
I am new to react native and I am having a warning that I just don't know how to get rid of it, is it ok if I just hide it as long as it does not become an error to crush my app?
The warning I receive:
Warning: Cannot update during an existing state transition (such as
within render or another component's constructor). Render methods
should be a pure function of props and state; constructor side-effects
are an anti-pattern, but can be moved to componentWillMount.
I tried to manage to not happen this warning but if I register a user and than go back to signupscreen and if I try to register another one the warning comes up.
It's best to resolve that warning, you need to look where your updates to the state are happening.
If you do updates to the state or props inside of your render function you are creating infinite render loops.
To help with this problem I need to have your code from render() function. You can Upload it here. Then I can review your code. It will help to solve this problem.
I'm trying to integrate third-party component Adaptive card in my application using VueJs but getting following error when wrapping it inside a separate component so that I can re-use it in other places.
Error in mounted hook: "TypeError: this._card.onExecuteAction is not a
function"
I've created a Demo to show the work done so far, can anyone suggest what I'm missing here.
I just need to integrate this adaptive card in my project as a reusable component
In fact, you are trying to call onExecuteAction function, instead of assigning it. It can be fixed, like this: this._card.onExecuteAction = action => this.$emit("action", action);
ps. i suggest you need also use :card="card" in your component template definition in TodoLis.vue and then add something like #action="handleAction" to it, to handle events emitted by your component.
I'm using the react-instantsearch module on a React Native app. I'm using it as a controlled component, passing in a searchState like so:
<InstantSearch
appId='something'
apiKey='somethingElse'
indexName='index'
searchState={this.props.algoliaSearchState}
>
When I change the category (hierarchicalMenu) or location (aroundLatLng), this works fine, but when I change the query it has no effect on the hits that I get.
I can see that the query is being passed in (both by logging, and in react-native devtools:
Any ideas what could be going wrong here?
For a refinement to be applied, it needs to be present inside the search state and have a corresponding widget mounted.
For hierarchicalMenu it's HierarchicalMenu, for aroundLatLng it's Configure and for query it's SearchBox.
If you don't want any rendering for a widget just create a VirtualWidget. But for its refinement to be applied, it should be mounted.