I have an extension that renders in the sidebar.
The extension is WebviewProvider that resolves a Webview.
I need to persist state in a Webview but the docs only describes how to do this in a WebviewPanel.
https://code.visualstudio.com/api/extension-guides/webview#getstate-and-setstate
How do you persist state in a Webview?
Related
I have put console log inside of my functional component file. In this file render whenever the API called. If I called API in some other file and the API not related to that file still got logs. I am not sure why. I have checked useEffect and usestate but no clue. Even search from google no clue.
I am using Usestate to store and useEffect to reloaded the the page when data change
I am using apisauce to call the API
React native navigation bottomtab to navigate the screen
Using React.memo but still page rendered.
Any one please help me to resolve this issue. because I am new to react native.
React components automatically re-render whenever there is a change in their state or props. A simple update of the state, from anywhere in the code, causes all the User Interface (UI) elements to be re-rendered automatically.
However, there may be cases where the render() method depends on some other data. After the initial mounting of components, a re-render will occur when:
A component’s setState() method is called.
A component’s forceUpdate() method is called.
Warning: You should normally try to avoid all uses of forceUpdate() and only read from this.props and this.state in render().
My app is wrapped in both Context and Navigation. The issue is that, everytime the context gets updated, the navigated component unmounts and remounts. This causes the keyboard to dismiss and other unwanted side effects.
Ah, the tutorial I used had me putting the imported file components inside a local function in my App class instead of linking them directly to the Stack.Screen. Working now.
So in my app I have a main component which have switch navigator and then inside switch navigator I have a tab navigator which renders different screens. I have registered notification handler in top component.
Now the problem is that when notification is received, I want to make some changes on screens inside tab navigator.
I have read about redux which will provide common store so state could be updated but I dont want to use that.
I have also read about lifting state up but in my case i have more nested components so I dont want to do that as well.
So suggest me some way to do it?
I have solved the problem by using react context api. It is simple wrap your top level component with provider and define some veriable and access that variable in any component.
I'm working on a React Native app that uses a WebView as the app's main screen.
When the app comes from the background to the foreground the WebView reloads. How can I stop this reloading?
This answer suggests loading the WebView in ViewDidLoad() rather than in ViewDidAppear() or ViewWillAppear(). Is this a real solution and how can I confirm, or change, how the WebView is loaded by React Native?
As a hacky solution I'm using onNavigationStateChange to save the current URL in AsyncStorage and then load this URL when the app comes to the foreground. This solution isn't great because it:
Breaks the browser history, affecting javascript back buttons
Doesn't remember form state
Might send the user to a page they can't directly access, resulting in them being sent to a 404
So I'd much prefer a solution that stops the reloading, at least for situations when the app is only momentarily in the background.
This was not and issue with the WebView. The reloading was caused by my misuse of the React Navigation SwitchNavigator. As mentioned in the docs a SwitchNavigator
resets routes to their default state when you switch away
This reset caused the WebView to reload.
I am building an app with tab bar using react native's NavigationExperimental API based on the example from github.
One thing I noticed is that tabs' UI states are not preserved when switching between tabs.
All state including fetched data, scroll position, other UI states, etc., are lost when I switch away from one tab to another.
As a result, it ends up refetching the data, and renders everything from the scratch.
The only thing that is preserved is the current navigation state tree.
This is not true for native apps. Native apps keep every state (data, scroll position and other UI states) so that the switch feels instant and lightweight avoiding any network calls or re-renderings.
How can this be implemented in react native?
I was thinking hiding and showing like display: 'none', but display is not available in react-native.