So lösen Sie die verstümmelten chinesischen Zeichen in Vue-Routing-Parametern

Wenn Sie Vue für die Entwicklung verwenden, ist es oft notwendig, die Funktion „Routing-Parameter“ zu verwenden, aber manchmal enthalten die übergebenen Parameter chinesische Zeichen, und es tritt das Problem verstümmelter chinesischer Zeichen auf. Dies liegt daran, dass die URL des Browsers nur die ASCII-Kodierung akzeptiert und die Kodierung chinesischer Zeichen nicht unterstützt, sodass bei der Übertragung chinesischer Zeichen verstümmelte Zeichen angezeigt werden. In diesem Artikel wird erläutert, wie Sie dieses Problem in Vue lösen können.

Problemumgehung

1. Verwenden Sie die Funktion encodeURIComponent()

Bei der Übergabe chinesischer Zeichen an die Route können Sie die Funktion encodeURIComponent() in JavaScript zum Codieren verwenden. Die Funktion dieser Funktion besteht darin, chinesische Zeichen in die URL-Kodierung umzuwandeln, damit chinesische Zeichen korrekt in der URL übertragen werden können.

Codebeispiel:

this.$router.push({
    path: '/detail',
    query: {
        id: 1,
        title: encodeURIComponent('这是中文标题')
    }
})

Hinweis: Die Verwendung dieser Methode erfordert eine Dekodierung auf der Seite, die die übergebenen Parameter empfängt. Die Dekodierungsmethode ist die Funktion decodeURIComponent().

2. Verwenden Sie Parameter von Vue-Router

Wenn Sie Vue-Router zum Übergeben von Parametern für das Routing verwenden, gibt es zwei Möglichkeiten, Parameter zu übergeben: Eine besteht darin, eine Abfrage zu verwenden, und die andere darin, Parameter zu verwenden. params besteht darin, Parameter zur Routing-Adresse hinzuzufügen und nicht als Abfrageparameter, wodurch das Problem verstümmelter chinesischer Zeichen vermieden werden kann.

Codebeispiel:

this.$router.push({
    path: `/detail/${encodeURIComponent('这是中文标题')}`,
    params: {
        id: 1
    }
})

Hinweis: Zu diesem Zeitpunkt müssen Sie die dynamische Route der Routing-Parameter deklarieren.

3. Chinesische Zeichen verwenden direkt englische oder Unicode-Codes

Wenn es sich nur um eine gewöhnliche Zeichenfolge anstelle eines Routenparameters handelt, können Sie auch direkt die englische Darstellung oder den Unicode-Code für chinesische Zeichen verwenden, um das Problem verstümmelter chinesischer Zeichen zu vermeiden.

Codebeispiel:

console.log('这是一段中文字符') // 输出这是一段中文字符
console.log('\u8FD9\u662F\u4E00\u6BB5\u4E2D\u6587\u5B57\u7B26') // 输出这是一段中文字符

Zusammenfassung

In diesem Artikel wird die korrekte Methode zum Übertragen chinesischer Zeichen in Vue vorgestellt. Es ist möglich, die Funktionskodierung encodeURIComponent() zu verwenden, den params-Parameter von vue-router zu verwenden und direkt die englische Notation zu verwenden Unicode-Code-Methode, Sie können sie entsprechend der tatsächlichen Situation verwenden.

Das obige ist der detaillierte Inhalt vonSo lösen Sie die verstümmelten chinesischen Zeichen in Vue-Routing-Parametern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!