diff --git a/src/guide/extras/web-components.md b/src/guide/extras/web-components.md index 2328fb09..4cdbcd28 100644 --- a/src/guide/extras/web-components.md +++ b/src/guide/extras/web-components.md @@ -22,7 +22,7 @@ Vue [безупречно получает 100% в тестах Custom Elements app.config.compilerOptions.isCustomElement = (tag) => tag.includes('-') ``` -#### Пример конфигураци Vite {#example-vite-config} +#### Пример конфигурации Vite {#example-vite-config} ```js // vite.config.js @@ -64,7 +64,7 @@ module.exports = { ### Передача свойств DOM {#passing-dom-properties} -Поскольку атрибуты DOM могут быть только строками, то появляется необходимость передавать сложные данные в пользовательские элементы через свойства DOM. При установке входных параметров для пользовательского элемента, Vue 3 автоматически проверяет наличие DOM-свойства с помощью оператора `in` и предпочтёт установить значение как DOM-свойство, если ключ присутствует. Чаще всего об этом и не придётся думать, если пользовательский элемент разработан следуя [рекомендуемым практикам] (https://web.dev/custom-elements-best-practices/). +Поскольку атрибуты DOM могут быть только строками, то появляется необходимость передавать сложные данные в пользовательские элементы через свойства DOM. При установке входных параметров для пользовательского элемента, Vue 3 автоматически проверяет наличие DOM-свойства с помощью оператора `in` и предпочтёт установить значение как DOM-свойство, если ключ присутствует. Чаще всего об этом и не придётся думать, если пользовательский элемент разработан следуя [рекомендуемым практикам](https://web.dev/custom-elements-best-practices/). Возможны крайние случаи, когда данные должны быть переданы как свойство DOM, но пользовательский элемент не объявляет/отражает свойство должным образом (приводя к неудаче при проверке с помощью `in`). В таких случаях, форсировать привязку `v-bind` для установки свойства DOM можно использованием модификатора `.prop`: @@ -128,7 +128,7 @@ document.body.appendChild( - Все входные параметры для пользовательского элемента, объявленные в опции `props`, будут определены в пользовательском элементе как свойства. Vue автоматически обработает соответствие между атрибутами / свойствами, где это необходимо. - - Атрибуты всегда отражаются в соответствующих свойств + - Атрибуты всегда отражаются в соответствующих свойствах - Свойства с примитивными значениями (`string`, `boolean` or `number`) отражаются как атрибуты. @@ -155,7 +155,7 @@ document.body.appendChild( #### Слоты {#slots} -Внутри компонента слоты могутуказываться как обычно, с помощью элемента ``. Но при получении результирующего элемента должен быть только [нативный синтаксис слотов](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots): +Внутри компонента слоты могут указываться как обычно, с помощью элемента ``. Но при получении результирующего элемента должен быть только [нативный синтаксис слотов](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots): - [Слоты с ограниченной областью видимости](/guide/components/slots#scoped-slots) не поддерживаются. @@ -177,7 +177,7 @@ document.body.appendChild( Официальные инструменты для однофайловых компонентов поддерживают их импорт в "режиме пользовательского элемента" (требуется `@vitejs/plugin-vue@^1.4.0` или `vue-loader@^16.5.0`). Однофайловый компонент, загруженный в режиме пользовательского элемента, вставляет свои теги `