الفرق بين المراجعتين لصفحة: «ReactNative/settings»

من موسوعة حسوب
طلا ملخص تعديل
طلا ملخص تعديل
 
(1 مراجعات متوسطة بواسطة نفس المستخدم غير معروضة)
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:settings في React Native}}</noinclude>
<noinclude>{{DISPLAYTITLE:الواجهة settings في React Native}}</noinclude>
تعمل <code>Settings</code> كمُغلِّف للواجهة [https://developer.apple.com/documentation/foundation/nsuserdefaults NSUserDefaults]، وهي مخزنٌ دائمٌ لقيمة المفتاح (key-value) المتوفّر على منصّة iOS فقط.
تعمل الواجهة <code>Settings</code> كمُغلِّف للواجهة [https://developer.apple.com/documentation/foundation/nsuserdefaults NSUserDefaults]، وهي مخزنٌ دائمٌ لقيمة المفتاح (key-value) المتوفّر على منصّة iOS فقط.


__toc__
__toc__


== مثالٌ ==
== مثال ==
<syntaxhighlight lang="javascript">
إليك المثال التالي ([https://snack.expo.dev/@hsoubwiki/settings-example تجربة حية]):<syntaxhighlight lang="javascript">
import React, { useState } from "react";
import React, { useState } from "react";
import { Button, Settings, StyleSheet, Text, View } from "react-native";
import { Button, Settings, StyleSheet, Text, View } from "react-native";
سطر 75: سطر 75:
* [https://facebook.github.io/react-native/docs/settings صفحة Settings في توثيق React Native الرسميّ]
* [https://facebook.github.io/react-native/docs/settings صفحة Settings في توثيق React Native الرسميّ]
[[تصنيف:ReactNative]]
[[تصنيف:ReactNative]]
[[تصنيف:React Native API]]

المراجعة الحالية بتاريخ 14:11، 9 أكتوبر 2021

تعمل الواجهة Settings كمُغلِّف للواجهة NSUserDefaults، وهي مخزنٌ دائمٌ لقيمة المفتاح (key-value) المتوفّر على منصّة iOS فقط.

مثال

إليك المثال التالي (تجربة حية):

import React, { useState } from "react";
import { Button, Settings, StyleSheet, Text, View } from "react-native";

const App = () => {
  const [data, setData] = useState(Settings.get("data"));

  const storeData = data => {
    Settings.set(data);
    setData(Settings.get("data"));
  };

  return (
    <View style={styles.container}>
      <Text>Stored value:</Text>
      <Text style={styles.value}>{data}</Text>
      <Button
        onPress={() => storeData({ data: "React" })}
        title="Store 'React'"
      />
      <Button
        onPress={() => storeData({ data: "Native" })}
        title="Store 'Native'"
      />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center"
  },
  value: {
    fontSize: 24,
    marginVertical: 12
  }
});

export default App;

التوابع

clearWatch()‎

static clearWatch(watchId: number)

يُعيد هذا التابع الرقم watchId عندما يهيّأ الاشتراك اعتياديًّا.

get()‎

static get(key: string): mixed

للحصول على القيمة الحاليّة للمفتاح المعطى key في NSUserDefaults.

set()‎

static set(settings: object)

لوضع قيمةٍ، أو أكثر في NSUserDefaults.

watchKeys()‎

static watchKeys(keys: string | array<string>, callback: function): number

للإعلام عن الاشتراك، وذلك عند تغيُّر قيمة أيّ مفتاحٍ محدّد بالمعامل key في NSUserDefaults. ويُعيد العدد watchId الذي يُستخدم مع الدّالة ‎‏‪.clearWatch() لإلغاء الاشتراك

ملاحظة: إنّ التابع watchKeys()‎ يتجاهل في تصميمه طلبات set()‎ الداخلية، ويستجيب للتّغيرات التي تنشأ خارج شفرة React Native فقط.

مصادر