Skip to content

docs(id): Penerjemahan pada berkas guide/migration - Part 2 #259

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 22 additions & 22 deletions src/guide/migration/keycode-modifiers.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,28 +3,28 @@ badges:
- breaking
---

# KeyCode Modifiers <MigrationBadges :badges="$frontmatter.badges" />
# Pengubah KeyCode <MigrationBadges :badges="$frontmatter.badges" />

## Overview
## Gambaran Umum

Here is a quick summary of what has changed:
Berikut adalah ringkasan singkat tentang apa yang telah berubah:

- **BREAKING**: Using numbers, i.e. keyCodes, as `v-on` modifiers is no longer supported
- **BREAKING**: `config.keyCodes` is no longer supported
- **MERUSAK**: Pengunaan angka-angka, contoh. keyCodes, sebagai pengubah `v-on` tidak lagi didukung
- **MERUSAK**: `config.keyCodes` tidak lagi didukung

## 2.x Syntax
## 2.x Sintaksis

In Vue 2, `keyCodes` were supported as a way to modify a `v-on` method.
Pada Vue 2, `keyCodes` didukung sebagai satu cara untuk mengubah suatu metode `v-on`.

```html
<!-- keyCode version -->
<!-- versi keyCode -->
<input v-on:keyup.13="submit" />

<!-- alias version -->
<!-- versi alias -->
<input v-on:keyup.enter="submit" />
```

In addition, you could define your own aliases via the global `config.keyCodes` option.
Tambahan, Anda dapat mendefinisikan alias Anda sendiri melalui opsi global `config.keyCodes`.

```js
Vue.config.keyCodes = {
Expand All @@ -33,40 +33,40 @@ Vue.config.keyCodes = {
```

```html
<!-- keyCode version -->
<!-- versi keyCode -->
<input v-on:keyup.112="showHelpText" />

<!-- custom alias version -->
<!-- versi alias kustom -->
<input v-on:keyup.f1="showHelpText" />
```

## 3.x Syntax
## 3.x Sintaksis

Since [`KeyboardEvent.keyCode` has been deprecated](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode), it no longer makes sense for Vue 3 to continue supporting this as well. As a result, it is now recommended to use the kebab-case name for any key you want to use as a modifier.
Dikarenakan [`KeyboardEvent.keyCode` telah usang](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode), sangat tidak masuk akal jika Vue 3 tetap mendukung hal ini. Sebagai gantinya, direkomendasikan untuk penggunaan nama kebab-case untuk semua key yang Anda akan gunakan sebagai pengubah.

```html
<!-- Vue 3 Key Modifier on v-on -->
<!-- Pengubah Vue 3 Key pada v-on -->
<input v-on:keyup.page-down="nextPage">

<!-- Matches both q and Q -->
<!-- kedua q dan Q cocok -->
<input v-on:keypress.q="quit">
```

As a result, this means that `config.keyCodes` is now also deprecated and will no longer be supported.
Hasilnya, hal ini berarti bahwa `config.keyCodes` juga telah usang dan tidak lagi didukung.

## Migration Strategy
## Strategi dalam Migrasi

For those using `keyCode` in their codebase, we recommend converting them to their kebab-cased named equivalents.
Untuk semua yang memakai `keyCode` pada codebase kalian, kami merekomendasikan pengubahaan `keyCode` menjadi penamaan kebab-cased yang setara.

The keys for some punctuation marks can just be included literally. e.g. For the `,` key:
keys sebagai tanda baca dapat dituliskan secara literal. contoh. untuk key `,`:

```html
<input v-on:keypress.,="commaPress">
```

Limitations of the syntax prevent certain characters from being matched, such as `"`, `'`, `/`, `=`, `>`, and `.`. For those characters you should check `event.key` inside the listener instead.
Limitasi dari sintaksis mencegah beberapa karakter untuk dicocokan, seperti `"`, `'`, `/`, `=`, `>`, dan `.`. Sebagai gantinya, untuk karakter-karakter tersebut Anda dapat cek `event.key` di dalam listener.

[Migration build flags:](migration-build.html#compat-configuration)
[Flag build migrasi:](migration-build.html#compat-configuration)

- `CONFIG_KEY_CODES`
- `V_ON_KEYCODE_MODIFIER`
36 changes: 18 additions & 18 deletions src/guide/migration/listeners-removed.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
title: $listeners removed
title: Penghapusan $listeners
badges:
- breaking
---

# `$listeners` removed <MigrationBadges :badges="$frontmatter.badges" />
# `$listeners` telah dihapus <MigrationBadges :badges="$frontmatter.badges" />

## Overview
## Gambaran Umum

The `$listeners` object has been removed in Vue 3. Event listeners are now part of `$attrs`:
Objek `$listeners` telah dihapuskan pada Vue 3. Event listeners sekarang bagian dari `$attrs`:

```js
{
Expand All @@ -17,10 +17,10 @@ The `$listeners` object has been removed in Vue 3. Event listeners are now part
}
```

## 2.x Syntax
## 2.x Sintaksis

In Vue 2, you can access attributes passed to your components with `this.$attrs`, and event listeners with `this.$listeners`.
In combination with `inheritAttrs: false`, they allow the developer to apply these attributes and listeners to some other element instead of the root element:
Pada Vue 2, Anda dapat mengakses atribut-atribut yang disuguhkan ke komponen-komponen Anda melalui `this.$attrs`, dan event listeners dengan `this.$listeners`.
Pengkombinasian dengan `inheritAttrs: false`, mereka membolehkan para pengembang untuk mengaplikasikan atribut-atribut dan listener-listener ini ke semua elemen lain daripada ke elemen root:

```html
<template>
Expand All @@ -35,9 +35,9 @@ In combination with `inheritAttrs: false`, they allow the developer to apply the
</script>
```

## 3.x Syntax
## 3.x Sintaksis

In Vue 3's virtual DOM, event listeners are now just attributes, prefixed with `on`, and as such are part of the `$attrs` object, so `$listeners` has been removed.
Pada Vue 3's virtual DOM, event listeners sekarang hanyalah sebuah atribut, diawali dengan `on`, dan merupakan bagian dari objek `$attrs`, sehingga `$listeners` telah dihapuskan.

```vue
<template>
Expand All @@ -52,7 +52,7 @@ export default {
</script>
```

If this component received an `id` attribute and a `v-on:close` listener, the `$attrs` object will now look like this:
jika komponen ini mendapatkan sebuah atribut `id` dan sebuah listener `v-on:close`, objek `$attrs` sekarang akan tampak seperti ini:

```js
{
Expand All @@ -61,16 +61,16 @@ If this component received an `id` attribute and a `v-on:close` listener, the `$
}
```

## Migration Strategy
## Strategi Migrasi

Remove all usages of `$listeners`.
Hapus semua penggunaan dari `$listeners`.

[Migration build flag: `INSTANCE_LISTENERS`](migration-build.html#compat-configuration)
[Flag build Migrasi: `INSTANCE_LISTENERS`](migration-build.html#compat-configuration)

## See also
## Baca juga

- [Relevant RFC](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0031-attr-fallthrough.md)
- [Migration guide - `$attrs`includes `class` & `style` ](./attrs-includes-class-style.md)
- [Migration guide - Changes in the Render Functions API](./render-function-api.md)
- [Migration guide - New Emits Option](./emits-option.md)
- [Migration guide - `.native` modifier removed](./v-on-native-modifier-removed.md)
- [Panduan Migrasi - `$attrs` memuat `class` & `style` ](./attrs-includes-class-style.md)
- [Panduan Migrasi - Perubahan pada Render Functions API](./render-function-api.md)
- [Panduan Migrasi - Opsi baru Emits](./emits-option.md)
- [Panduan Migrasi - Pengubah `.native` dihapuskan](./v-on-native-modifier-removed.md)
22 changes: 11 additions & 11 deletions src/guide/migration/props-default-this.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
---
title: Props Default Function this Access
title: Akses Props Fungsi Bawaan this
badges:
- breaking
---

# Props Default Function `this` Access <MigrationBadges :badges="$frontmatter.badges" />
# Akses Props Fungsi Bawaan `this` <MigrationBadges :badges="$frontmatter.badges" />

Props default value factory functions no longer have access to `this`.
Nilai bawaan props fungsi-fungsi factory tidak lagi memilki akses terhadap `this`.

Instead:
Melainkan:

- Raw props received by the component are passed to the default function as argument;
- Raw props didapatkan dari komponen yang dilewatkan menuju fungsi bawaan sebagai argumen;

- The [inject](../composition-api-provide-inject.md) API can be used inside default functions.
- [inject](../composition-api-provide-inject.md) API dapat digunakan di dalam fungsi-fungsi bawaan.

```js
import { inject } from 'vue'
Expand All @@ -21,16 +21,16 @@ export default {
props: {
theme: {
default (props) {
// `props` is the raw values passed to the component,
// before any type / default coercions
// can also use `inject` to access injected properties
// `props` merupakan nilai raw dilewatkan menuju komponen,
// sebelum dilakukan type / default coercions
// dapat juga menggunaan `inject` untuk mengakses properti yang diinjeksikan
return inject('theme', 'default-theme')
}
}
}
}
```

## Migration Strategy
## Stategi Migrasi

[Migration build flag: `PROPS_DEFAULT_THIS`](migration-build.html#compat-configuration)
[Flag build migrasi: `PROPS_DEFAULT_THIS`](migration-build.html#compat-configuration)