We Keep Coding

How to share globally in the app the state of a class component

I am new to React Native, I am trying to change the state of an arithmetic function in a class component located in one screen and then share it globally in order to use it in different screens and possibly change it, what are some of the ways in which I can do this?

You can either lift the state up or use context API
also maybe you should consider using React Hooks
maybe this thread is similar to your issue
also, these articles could help with the context 1, 2

Updating data on a Vue component shared between 2 routes

So basically, i have declared 2 different routes and set them to use the same component.
How do i go about updating the data (different API requests based on route) in this component.
I managed to make it work by calling a method this.updateData per say and calling this method on created lifecycle hook and also calling it on watching the $route.path property, and it works but it seems a dirty way to make it work to me, and i might be missing something.
Edit: Im using just Vue js for Simple Page Application, no other frameworks nothing fancy.

For anyone running to the same problem, vue.js tries to reuse components instances as much as it can so basically unless you have a key unique attribute on the component it will point to the same component instance.
So to have a different instance for everytime you use that component add a key attribute which has to be unique. e.g.
<router-view v-bind:key="$router.path" />
In this case it will use the path as a key so that for each route you use a shared component it will create a new instance and you can access the created() lifecycle hook on each one.

Is it bad to use v-model with object especially through several nested components in VueJS?

I have a big problem using v-model with an object passed through 2 layers of nested components. I've described the problem here VueJS v-model for object prop through nested components doesn't make update them as expected . But now I'm wondering, maybe this approach is very bad and there are some reasons for it?

One or two lvls of props is okay. If you need to waterfall your data deeper, use store. Divide your components into container components and stupid components. Containres have connection with store and they apss data down to their childrens. Stupid components only render data and emits changes.

React / Redux deep props dependecy

I have a question about how to structure a React/Redux app.
As far as I understand, it's not recommended practice to reference containers inside a component. However when nesting components withing a Redux app, the top level container is bound with a connect() and mapStateToProps etc, but it seems strange to pass in all props down the line to -only- components.
When structuring an app with a nested component for example like:
Dialog > Form > Tab > Input Section > Input control
the input control could have a prop isVisible, where it seems strange to me that I would have to pass the prop all the way down the tree.
So my question is mainly, is this indeed what is recommended and how is this handled? Is this for example simplified by setting props to something like:
{
inputProps: { visible: false }
}
?
Or, can I reference a container inside my component, so I can have a separate connect() for only the props actually relevant?

One of the main points of Redux is to allow individual components to connect to the store and extract the data they need. Also, don't overthink the whole "container/component" distinction in terms of separating things in the codebase.
See the Redux FAQ entry at https://redux.js.org/faq/react-redux#should-i-only-connect-my-top-component-or-can-i-connect-multiple-components-in-my-tree for more info on connecting multiple components, and Dan Abramov's tweet at https://twitter.com/dan_abramov/status/802569801906475008 for thoughts on "container vs presentational" structuring.

If you find yourself passing down many properties, maybe they should be containers.
Just take redux-form as an example. It could perfectly be all about components, but they decided to use redux as well.

Sharing application store state

Im using Vue and Vuex in my application and I have some components. By the time passing I know I will probably have a few more which is gonna be a lot. So I have a problem with sharing the app state within all the components. So I'd like to know which way should I follow? Either passing the state to all the components no matter child or parent, or passing the state to a parent one that will be used in some of its child components and then passing the state to them as a property (however, I do need to import the mutations methods because props are not reactive)?
UPDATE:
Keep in mind though that if a component is going to be displayed or hidden and the conditional statement v-if is attached to the component custom tag, each time the entire component is going to be rendered again! But not if statement was only on some child tags in the component.
Thanks in advance.

What you are asking is a false dilemma. From the official documentation:
By providing the store option to the root instance, the store will be injected into all child components of the root and will be available on them as this.$store.
(emphasis mine)
Which means that sharing the store between components no matter how deep in the component tree is handled for you automatically by vue and vuex.

It's quite opinion based question, but I would say it is much better way to use Vuex since the beginning if you know that your app can be developed into large scale.
Passing states from parent to child all the way etc is not good way, so it is better to use Vuex now and you will save a lot of time changing your app in the future when you would have no other way than vuex.