Quelques méthodes publiques js courantes utilisées dans uniapp

Avec le développement continu du développement front-end, de plus en plus de développeurs choisissent d'utiliser uniapp pour développer des applications multiplateformes. uniapp est une plate-forme de développement basée sur le framework Vue.js, qui peut créer rapidement des applications devant s'exécuter sur plusieurs plates-formes en même temps. Dans ce cas, l’utilisation des méthodes public js est un moyen efficace de réutiliser le code et d’améliorer l’efficacité du développement. Cet article présentera quelques méthodes publiques js courantes utilisées dans uniapp.

1. Obtenir les paramètres de la page

Dans uniapp, nous pouvons facilement obtenir les paramètres de la page actuelle via la méthode uni.getStorageSync(key). Par exemple, si nous voulons obtenir l'ID de la page, nous pouvons le faire via le code suivant :

const query = this.$mp.page.options;
const id = query.id;

Ici, this.$mp.page.options représente la collection de paramètres de la page actuelle, où query.id est la valeur de l'identifiant dans le paramètre. De cette façon, nous pouvons facilement obtenir la valeur de n’importe quel paramètre de la page.

2. Méthodes pour éviter le gigue

Dans certaines pages avec des fonctions complexes, de nombreuses opérations déclencheront des événements. Si les utilisateurs cliquent fréquemment, cela entraînera une instabilité des données. À l'heure actuelle, nous pouvons utiliser la méthode de prévention de la gigue pour résoudre ce problème. Anti-shake signifie que plusieurs appels à la même fonction ne sont exécutés qu'une seule fois sur une période donnée. Nous utilisons généralement une minuterie pour y parvenir. Comme indiqué ci-dessous :

var timer=null;
function debounce(fn,time){
    if(timer!=null){
        clearTimeout(timer)
    }

    timer=setTimeout(function(){
        fn()
    },time)
}

调用：

debounce(function(){
    console.log('防抖成功')
},1000)

Dans le code ci-dessus, la fonction de la méthode anti-rebond est d'empêcher cette fonction d'être exécutée plusieurs fois dans un court laps de temps. Lorsque la fonction est appelée, non. peu importe le nombre de fois où elle est appelée en quelques millisecondes d'attente, cette fonction ne sera exécutée qu'une seule fois.

3. Obtenez la valeur correspondante dans l'objet en fonction de la valeur clé

Dans certains scénarios où des structures de données complexes doivent être traitées, nous rencontrons généralement le besoin d'obtenir la valeur correspondante dans l'objet en fonction de la valeur clé. Par exemple, le tableau suivant :

let arr = [
    { name: '张三', age: 18 },
    { name: '李四', age: 19 },
    { name: '王五', age: 20 }
]

Si vous souhaitez obtenir la valeur d'âge de l'objet nommé Li Si, vous pouvez utiliser le code suivant pour y parvenir :

function findValue(arr, key, value) {
    for (let i = 0; i < arr.length; i++) {
        if (arr[i][key] == value) {
            return arr[i]
        }
    }
    return null
}

var result = findValue(arr,'name','李四')
console.log(result.age) // 19

Dans le code ci-dessus, la fonction de la méthode findValue est pour trouver l'objet qui remplit les conditions dans le tableau et lui renvoyer cet objet. Où arr est un tableau, key est le nom de l'attribut dans l'élément du tableau et value est la valeur de l'attribut à trouver.

4. Déterminer le type de variable

Dans certains scénarios de traitement de données, nous devons déterminer le type de variables pour passer à l'étape suivante. La méthode typeof en JavaScript peut facilement obtenir le type d'une variable :

console.log(typeof 'uniapp') // string
console.log(typeof true) // boolean
console.log(typeof 1) // number
console.log(typeof undefined) // undefined
console.log(typeof null) // object
console.log(typeof {}) // object
console.log(typeof []) // object
console.log(typeof function() {}) // function

Il convient de noter que le résultat de typeof null est 'object', ce qui est un problème historique de JavaScript.

Pour résumer, les quatre méthodes publiques js ci-dessus sont souvent utilisées dans le développement d'uniapp, ce qui peut considérablement améliorer l'efficacité du développement. J'espère que cet article pourra vous être utile.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!