I am working with React Native version 0.45.1 and with moment version 2.18.1.
I am trying to change the date according to the device local, but I always get the date in 'en-Us' locale.
I can't import all of the locales as I saw in some solutions since I don't know the device locale in advance.
(for example: https://github.com/moment/moment/issues/2962)
any other options?
I can't import all of the locales as I saw in some solutions since I don't know the device locale in advance.
Actually, you can import all of the locales in moment like this (moment-with-locales is mentioned right there on the homepage):
import moment from 'moment/min/moment-with-locales'
// Or if you are using require instead:
var moment = require('moment/min/moment-with-locales')
Then you should be able to get your device locale with whatever module/method you prefer (in my example, I'll be using Expo) and change the moment locale to it. For example:
var deviceLocale = await Expo.Util.getCurrentLocaleAsync()
moment.locale(deviceLocale)
I won't say that importing everything is the best method for handling this as moment-with-locales is larger than just moment, but it does what you want it to accomplish. You can also go the route of just importing the locales you support as mentioned in that Github comment I linked to.
Instead of importing locale by locale, I'm using this solution to set the locale globally:
import { getDeviceLocale } from "react-native-device-info";
import moment from "moment";
import "moment/min/locales";
const deviceLocale = getDeviceLocale();
moment.locale(deviceLocale); //set your locale (eg: fr)
moment(1316116057189).fromNow(); // il y a 7 ans
Sharing this to those who need it
Related
Is there any React-native library that helps getting the difference between two dates. I mean like the following.
Example
try using moment
import moment from 'moment';
{
moment(date, 'YYYY-MM-DD')
.month(0)
.from(moment().month(0))
}
'YYYY-MM-DD' can be whatever format
this one is getting me the difference between the given date and now
here you can find documentation https://momentjs.com/docs/
and here more libraries https://blog.logrocket.com/4-alternatives-to-moment-js-for-internationalizing-dates/
I am using moment.js to get the current date, however I am having a problem about the date formatting and I don't have any idea on how to customize it since I am just new using it.
By the way I used this.
moment().format('LLLL');
My expected output is:
Mmmm-dd-yyyy hh:mmAM/PM (Timezone) or just like Sep-19-2020 3:00AM (GMT +8)
Is the any other way to achieve this?
moment().locale('tr').format("MMM-DD-yyyy h:mA [(GMT] Z[)]")
moment().locale('en_US').format("MMM-DD-yyyy h:mA [(GMT] Z[)]")
If you want to use locale in React Native.
instead
import moment from 'moment'
you should use this
import 'moment/min/moment-with-locales'
moment.locale('tr');
moment().format("MMM-DD-yyyy h:mA [(GMT] Z[)]");
The things you write in square brackets are written directly. that is, they are escape characters.
Is there a way to get intellisense to work for imported mutation types with Vue and VS Code. I have the Vetur extension installed and I am using constant named mutations.
I want to have a file - mutation-types.js
export default {
MY_MUTATION_TYPE: 'MY_MUTATION_TYPE',
ANOTHER_MUTATION_TYPE: 'ANOTHER_MUTATION_TYPE'
}
then whenever I import:
import mutationTypes from './mutation-types'
I want to have intelisense on the mutationTypes object.
Is this is anyway possible?
Isn't this wrong and throwing syntax errors?
It should be:
export default {
MY_MUTATION_TYPE: 'MY_MUTATION_TYPE',
ANOTHER_MUTATION_TYPE: 'ANOTHER_MUTATION_TYPE',
}
That would make auto complete work.
Since you are doing default export, in your import you also should use default import syntax. In your case mutationTypes can be any name, so that's why autocomplete will not work in the import. It will work on the object itself though:
To make it work in imports, you should use named exports.
I'm currently playing around with deck.gl.
Taking the UK accident example (3d-heatmap). How can I change the language used to display the POI in mapboxGL?
Where should I put the mapboxGL equivalent of:
map.setLayoutProperty('country-label-lg', 'text-field', '{name_fr}');
This is mostly related to the usage of react-map-gl rather than deck.gl, given that's what the example is using.
You can grab the mapbox map instance using the getMap() method of the < MapGL> component, and call the method to change the layout property:
<MapGL ... ref='map' />
const map = this.refs.map.getMap()
map.setLayoutProperty('country-label-lg', 'text-field', '{name_fr}')
With Java, import is really easy and clear.
You import with the following statement :
import fr.domain.MyUtils;
Then you can use it like this:
MyUtils.myStaticMethod();
You need to namespace MyUtils only if there are two in the same file.
With Typescript AMD and requirejs it seems to be more complicated.
Here the import statement:
import u = require('fr/domain/MyUtils');
And the way to use it:
u.fr.domain.MyUtils.myStaticMethod();
Quite verbose...
The only way I found so fare to use an alias was to double the import statement:
import u = require('fr/domain/MyUtils');
import MyUtils = u.fr.domain.MyUtils;
After doing that you can write this in a module:
MyUtils.myStaticMethod();
It's cleaner but Eclipse TS plugin get completely lost with this and auto completion become erratic. In Visual Studio auto completion is OK but "F12 Go to definition" has to be done twice which is annoying.
Is there a better way to do this ? Or should we just keep namespaces as short as we can ?
You’re doing it wrong.
Your 'fr/domain/MyUtils' module should be exporting only whatever is supposed to be MyUtils. i.e. it should look like this:
export function myStaticMethod() { /* ...code... */ }
It should not be exporting some global namespace object, and it should not be adding anything to some global namespace object that you get from somewhere else. The natural placement of module files in directories is the way you create “namespaces” when you work with external modules.
If you do it correctly then your consumer looks like this:
import MyUtils = require('fr/domain/MyUtils');
MyUtils.myStaticMethod();
or, even more properly using ES module syntax:
import { myStaticMethod } from 'fr/domain/MyUtils';
myStaticMethod();