Skip to main content
Version: <=v1.1.11

GetLanguages()​

info

The GetLanguages function in react-country-state-city fetches a list of language objects. The async function returns an array of language objects, each containing details such as name, code, and native.

Usage​

import React, { useEffect } from "react";
import { GetLanguages } from "react-country-state-city";
export default function App() {
  useEffect(() => {
    GetLanguages().then((_languages) => console.log(_languages));
  }, []);
  return <div>...</div>;
}

Parameters​

NameTypeDefaultRequiredDescription
srcstringEmpty❌URL where data files are hosted (e.g., https://venkatmcajj.github.io/react-country-state-city/)

Results​

Returns a language object lists.

Sample​

Show Code
import React, { useState, useEffect } from "react";
import { GetLanguages } from "react-country-state-city";

function App() {
  const [language, setLanguage] = useState(null);
  const [languageList, setLanguageList] = useState([]);
  useEffect(() => {
    GetLanguages().then((result) => {
      setLanguageList(result);
    });
  }, []);
  return (
    <div
      style={{
        border: "1px solid gray",
        borderRadius: "8px",
        padding: "16px",
        marginTop: "16px",
      }}
    >
      <div style={{ maxWidth: "600px", margin: "auto" }}>
        <h6 style={{ marginTop: 10, marginBottom: 5 }}>Language</h6>
        <select
          onChange={(e) => setLanguage(e.target.value)}
          value={language}
          style={{ width: "100%", minHeight: 40 }}
        >
          <option value={""}>-- Select Language --</option>
          {languageList.map((_lan) => (
            <option key={_lan.name} value={_lan.name}>
              {_lan.name}
            </option>
          ))}
        </select>
      </div>
    </div>
  );
}

export default App;

Language