I'm trying to add multi-languages for my app but get some troubles. When I try to reload a page, the page title is always the default language. Here is my i18n init. Very appreciate your help, thank you!
My i18next init
I faced the same issue and did a workaround to solve this as there is not a lot of help about this in the official documentation.
Here is what I did.
In i18n initilization added
lng: localStorage.getItem("i18nextLng") || "tr",
fallbackLng: localStorage.getItem("i18nextLng") || "tr",
On language change set lang key in local storage like
localStorage.setItem("i18nextLng", langKey);
This solved all the edge cases for me. I hope this will help.
Related
i18n react how to make the url change when changing settings?
Eg, I am located at /community, the language is English. I switch the language to Russian - the url becomes /ru/community
Here is my answer on another thread. You can create a URL manipulator function or use onLanguageChanged as in the APIs.
This is my first post here, so forgive me if I am not upfront with anything.
I have a Gatsby site that is being deployed via netlify.
Been running into a very random bug that I have searched the dark reaches of the internet but cannot find the fix for.
Intermediately, the site styles on my website break completely. Upon inspecting, I see my global.css file isn’t being applied. Upon a refresh, this issue goes away.
Site is accessible by this link: https://ellicottrealty.netlify.app/ 2
Upon looking online, I see that I should define the css export in my Gatsby-browser.js file.
I have done so explicitly by writing the following:
const React = require(“react”)
// gatsby-browser.js
import “./src/global.css”
However this is still happening in my app.
Screenshot attached for reference. Any help would be very helpful!
Thanks Guys!
Example of Broken Styles
Loom video for better visual context: https://www.loom.com/share/05e9234636304eeea44d2ae8337c542c
I think you're looking at a symptom and not the cause. I see that your site is loading infinitely on the /properties route. It's very hard to debug the problem without the total context, but I believe the infinite loop is in this code.
React.useEffect(() => {
console.log("ran");
if (searchOptions) {
console.log(searchOptions);
if (searchOptions.label) {
console.log(searchOptions.label);
Cookies.set("locationLabel", JSON.stringify(searchOptions.label));
}
console.log("ran");
services.repliers.getListings({ ...searchOptions, page }).then(setListings);
}
}, [searchOptions, page]);
Like I said before, it's hard to figure out what your exact problem is without enough context. Maybe you should add listings to the dependency array as well?
I am researching options for integrating language translation into a web app. I am comparing Google Translations API and React i18n right now, and it seems like i18n requires you to manually add all translations yourself - as in getting ahold of the translation for every page and adding that into the json data for the translation file.
I am just looking for confirmation that that is the way i18n works, and that I am not misunderstanding anything.
I was actually able to answer my own question. In case anyone else has the same question, the answer is yes: it does require manual translation for the entire site.
The documentation seems rather ambiguous and a tad minimalist on this API by React Native.
So I just want to clarify some things with those who have experience in using React Native's Geolocation API:
What's the use of clearWatch() method if what we need to unsubscribe from watchPosition() is stopObserving()? Do we need both to properly unsubscribe?
Does watchPosition() run when the app is in background by default or do we need to do background setup explicitly? (I do not need it to run on background just when the app is in use, hence the third question)
If it does run in the background by default, I know we need to set NSLocationAlwaysUsageDescription for IOS' info.plist, but is there any special setup for Android?
Thanks in advance for any Information on these 3 questions that has been bugging me! :D
I am just starting with ReactJS and trying to integrate with Stormpath for user login. They provide default behaviors for /register and /login path.
I want ReactJS to redirect to those local links for now rather than creating new routes and components. How can this be achieved.
Thanks!
I also work at Stormpath and just a few days ago I released the Stormpath React SDK. With this you'll be able to integrate Stormpath into your React application with very little effort.
To get started checkout our example application or read the blog post I wrote for it.
And if you have any questions, feel free to hit me up at robin [at] stormpath [dot] com.
Cheers!
I work at Stormpath. We're recommending that you try to use our express-stormpath module. But we do have some issues that we're working on fixing.
It is not yet possible to disable the default HTML views, but still retain the JSON API. We will be fixing this in a future release. This creates a problem for React Flux applications that want to use the /login route in their browser application, but not use our default HTML views.
To work around the problem, you can change the uri of the route to a different URL than /login. For example:
app.use(stormpath.init(app, {
website: true,
web: {
login: {
uri: '/api/login'
}
}
}));
Your browser code will need to make it’s login POST to /api/login
Can you give this a try and let me know if is helps? Thanks!