docs: remove "Using data" section from "Conditional Rendering" guide and fix passing data test example (#2743)

Fixes #2741

Author: guoxk-hb

docs/fr/guide/essentials/conditional-rendering.md

@@ -68,31 +68,6 @@ test('n\'affiche pas le lien admin', () => {
 
 Remarquez que nous appelons `exists()` sur la valeur retournée par `.find()`. `find()`, comme `mount()`, retourne également un `wrapper`. `mount()` a quelques méthodes supplémentaires, car il enveloppe un composant Vue, et `find()` ne retourne qu'un nœud DOM standard, mais de nombreuses méthodes sont partagées entre les deux. D'autres méthodes incluent `classes()` qui retournera les classes qu'un nœud DOM a, ou encore `trigger()`, qui simulera une interaction utilisateur. Vous pouvez trouver une liste des méthodes prises en charge [ici](../../api/#Methodes-de-Wrapper).
 
-## Utilisation de `data`
-
-Le dernier test consiste à vérifier que le lien admin est rendu lorsque `admin` est à `true`. Il est par défaut à `false`, mais nous pouvons le surcharger en utilisant le deuxième argument de `mount()`. Les options de cette fonction sont [`disponibles ici`](../../api/#mount-options).
-
-Pour `data`, nous utilisons l'option éponyme :
-
-```js
-test('affiche le lien admin', () => {
-  const wrapper = mount(Nav, {
-    data() {
-      return {
-        admin: true,
-      };
-    },
-  });
-
-  // Encore une fois, en utilisant `get()` nous vérifions implicitement que l'élément existe
-  expect(wrapper.get('#admin').text()).toEqual('Administration');
-});
-```
-
-Si vous avez d'autres propriétés dans `data`, ne vous inquiétez pas - Vue Test Utils fusionnera les deux ensemble. Le champ `data` dans les options de `mount()` aura la priorité sur toutes les valeurs par défaut.
-
-Pour découvrir quelles sont les autres options de `mount()`, consultez [`Passer des données aux Composants`](../essentials/passing-data.md) ou consultez les [`options de mount()`](../../api/#mount-options).
-
 ## Vérifier la visibilité des Éléments
 
 Parfois, vous ne voulez que masquer/afficher un élément tout en le conservant dans le DOM. Vue propose `v-show` pour des scénarios de ce genre. (Vous retrouverez les différences entre `v-if` et `v-show` [ici](https://v3.vuejs.org/guide/conditional.html#v-if-vs-v-show)).

docs/fr/guide/essentials/passing-data.md

@@ -30,7 +30,7 @@ Nous voulons réutiliser ce composant dans tous nos projets, chacun ayant des ex
 
 Nous allons afficher une erreur si `password` est inférieur à `minLength`. Nous pouvons le faire en créant une `computed` nommée `error` et en la rendant de manière conditionnelle à l'aide de `v-if` :
 
-```js
+```vue
 <!-- Password.vue -->
 <script setup>
 import { ref, computed } from 'vue'
@@ -44,7 +44,7 @@ const error = computed(() => {
   }
   return
 })
-<script>
+</script>
 
 <template>
   <div>

docs/guide/essentials/conditional-rendering.md

@@ -69,32 +69,6 @@ test('does not render an admin link', () => {
 
 Notice we are calling `exists()` on the value returned from `.find()`. `find()`, like `mount()`, also returns a `wrapper`. `mount()` has a few extra methods, because it's wrapping a Vue component, and `find()` only returns a regular DOM node, but many of the methods are shared between both. Some other methods include `classes()`, which gets the classes a DOM node has, and `trigger()` for simulating user interaction. You can find a list of methods supported [here](../../api/#Wrapper-methods).
 
-## Using `data`
-
-The final test is to assert that the admin link is rendered when `admin` is `true`. It's `false` by default, but we can override that using the second argument to `mount()`, the [`mounting options`](../../api/#mount).
-
-For `data`, we use the aptly named `data` option:
-
-```js
-test('renders an admin link', () => {
-  const wrapper = mount(Nav, {
-    data() {
-      return {
-        admin: true
-      }
-    }
-  })
-
-  // Again, by using `get()` we are implicitly asserting that
-  // the element exists.
-  expect(wrapper.get('#admin').text()).toEqual('Admin')
-})
-```
-
-If you have other properties in `data`, don't worry - Vue Test Utils will merge the two together. The `data` in the mounting options will take priority over any default values.
-
-To learn what other mounting options exist, see [`Passing Data`](../essentials/passing-data.md) or see [`mounting options`](../../api/#mount).
-
 ## Checking Elements visibility
 
 Sometimes you only want to hide/show an element while keeping it in the DOM. Vue offers `v-show` for scenarios as such. (You can check the differences between `v-if` and `v-show` [here](https://v3.vuejs.org/guide/conditional.html#v-if-vs-v-show)).

docs/guide/essentials/passing-data.md

@@ -44,7 +44,7 @@ const error = computed(() => {
   }
   return
 })
-<script>
+</script>
 
 <template>
   <div>

docs/zh/guide/essentials/conditional-rendering.md

@@ -68,31 +68,6 @@ test('does not render an admin link', () => {
 
 请注意，我们在 `.find()` 返回的值上调用了 `exists()`。`find()` 和 `mount()` 一样，也会返回一个 `wrapper`。`mount()` 有一些额外的方法，因为它包装的是 Vue 组件，而 `find()` 只返回普通的 DOM 节点，但它们之间有许多共享的方法。其他方法还包括 `classes()`，用于获取 DOM 节点的 class 属性，以及用于模拟用户交互的 `trigger()`。你可以在[这里](../../api/#Wrapper-methods)找到支持的方法列表。
 
-## 使用 `data`
-
-最后一个测试是断言当 `admin` 为 `true` 时，会渲染 admin 链接。它的默认值是 `false`，但我们可以使用 `mount()` 的第二个参数，即[挂载选项](../../api/#mount)来覆盖它。
-
-对于 `data`，我们使用恰如其名的 `data` 选项：
-
-```js
-test('renders an admin link', () => {
-  const wrapper = mount(Nav, {
-    data() {
-      return {
-        admin: true
-      }
-    }
-  })
-
-  // 同样，使用 `get()` 时我们隐式地断言了元素存在。
-  expect(wrapper.get('#admin').text()).toEqual('Admin')
-})
-```
-
-如果你在 `data` 中还有其他属性，不用担心，Vue Test Utils 会将两者合并。挂载选项中的 `data` 会优先于任何默认值。
-
-要了解其他挂载选项，请参见[传递数据](../essentials/passing-data.md)或[挂载选项](../../api/#mount)。
-
 ## 检查元素可见性
 
 有时你可能只想隐藏/显示一个元素，同时将其保留在 DOM 中。Vue 为这种场景提供了 `v-show` 指令。(你可以在[这里](https://cn.vuejs.org/guide/essentials/conditional.html#v-if-vs-v-show)查阅 `v-if` 和 `v-show` 的区别。)

docs/zh/guide/essentials/passing-data.md

@@ -40,11 +40,11 @@ const password = ref('')
 
 const error = computed(() => {
   if (password.value.length < props.minLength) {
-    return `Password must be at least ${props.minLength} characters.`
+    return `密码必须至少包含 ${props.minLength} 个字符。`
   }
   return
 })
-<script>
+</script>
 
 <template>
   <div>
@@ -69,7 +69,7 @@ test('renders an error if length is too short', () => {
     }
   })
 
-  expect(wrapper.html()).toContain('密码必须至少包含 10 个字符')
+  expect(wrapper.html()).toContain('密码必须至少包含 10 个字符。')
 })
 ```