{"id":356509,"date":"2024-05-20T23:31:16","date_gmt":"2024-05-20T23:31:16","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=356509"},"modified":"-0001-11-30T00:00:00","modified_gmt":"2024-05-20T23:31:16","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=356509","title":{"rendered":"<span>\u041a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u0433\u0438\u0434 \u043f\u043e Vue.js: \u0432\u0441\u0451 \u043e props<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u0425\u0430\u0431\u0440! \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c\u0441\u044f, \u043a\u0430\u043a frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0443 \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u044c \u043d\u0430 \u00ab\u043a\u0443\u0445\u043d\u0435\u00bb props. \u0412\u044b\u0431\u0438\u0440\u0430\u0439\u0442\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0438\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: \u0434\u0436\u0443\u043d\u044b-\u043f\u043e\u0432\u0430\u0440\u044f\u0442\u0430 \u0441\u043c\u043e\u0433\u0443\u0442 \u043b\u0443\u0447\u0448\u0435 <a href=\"#1\"><u>\u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0438 props \u043d\u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 Vue.js<\/u><\/a>, \u0430 \u0435\u0449\u0435 \u043c\u044b \u0437\u0430\u0442\u0440\u043e\u043d\u0435\u043c \u0442\u0435\u043c\u0443 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u0414\u043b\u044f \u043c\u0438\u0434\u043b\u043e\u0432 \u0438 \u0431\u043e\u043b\u0435\u0435 \u043e\u043f\u044b\u0442\u043d\u044b\u0445 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0441\u0442\u043e\u0432 \u2014 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0445 \u0448\u0435\u0444-\u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u043c\u044b \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u0438\u043b\u0438 <a href=\"#4\"><u>\u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 props<\/u><\/a>, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u043e\u0441\u0432\u0435\u0436\u0438\u0442\u044c \u0432 \u043f\u0430\u043c\u044f\u0442\u0438 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u0438\u043b\u0438 \u0440\u0435\u0448\u0438\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443, \u0435\u0441\u043b\u0438 \u0437\u0430\u043c\u044b\u043b\u0438\u043b\u0441\u044f \u0433\u043b\u0430\u0437.\u00a0<\/p>\n<p><a href=\"https:\/\/www.freecodecamp.org\/news\/how-to-use-props-in-vuejs\/\"><strong><u>Props<\/u><\/strong><\/a><strong> <\/strong>\u2013 \u043e\u0442 \u0441\u043b\u043e\u0432\u0430 \u00abproperties\u00bb (\u0437\u0434\u0435\u0441\u044c \u0438 \u0434\u0430\u043b\u044c\u0448\u0435 \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0432\u043e \u00abprops\u00bb) \u2013 \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0432 \u044d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0435 Vue \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. \u041e\u043d\u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c \u0442\u0438\u043f\u044b \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c \u0441 \u043d\u0438\u043c\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e.<\/p>\n<p>\u041f\u043e \u0431\u043e\u043b\u044c\u0448\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043f\u043e\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 props. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u0442\u0430\u0442\u044c\u044f \u0431\u0443\u0434\u0435\u0442 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u0430 \u043a\u0430\u043a \u0434\u043b\u044f Vue 2, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f Vue 3, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043f\u043e \u0447\u0430\u0441\u0442\u0438 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f props \u043e\u0442\u043b\u0438\u0447\u0438\u0439 \u043c\u0430\u043b\u043e. \u041d\u043e \u0442\u0430\u043a \u043a\u0430\u043a \u0432 Composition API \u0438 TypeScript \u0432\u0441\u0435 \u0436\u0435 \u043e\u043d\u0438 \u0435\u0441\u0442\u044c, \u0442\u043e \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0438\u0445 \u0442\u043e\u0436\u0435.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0433\u043e\u0442\u043e\u0432\u044b, \u0442\u043e \u0434\u043e\u0431\u0440\u043e \u043f\u043e\u0436\u0430\u043b\u043e\u0432\u0430\u0442\u044c, \u043c\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u043c \u043d\u0430\u0448 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u0433\u0430\u0439\u0434! <em>Bon app\u00e9tit!<\/em><\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/fd0\/b8d\/690\/fd0b8d690b6dcb655464c6b223ca9aac.png\" width=\"780\" height=\"440\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/fd0\/b8d\/690\/fd0b8d690b6dcb655464c6b223ca9aac.png\"\/><\/figure>\n<h2>\u041e\u0433\u043b\u0430\u0432\u043b\u0435\u043d\u0438\u0435<\/h2>\n<ol>\n<li>\n<p><a href=\"#1\"><strong>\u0420\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c\u0441\u044f \u0441 Props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 1\/5)<\/p>\n<\/li>\n<li>\n<p><a href=\"#2\"><strong>\u0427\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 props \u0438 \u043d\u0435 \u0438\u0441\u043f\u043e\u0440\u0442\u0438\u0442\u044c \u0432\u0441\u0451<\/strong><\/a><\/p>\n<p>\u2022 <a href=\"#2.1\">\u041a\u0430\u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#3\"><strong>\u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 3\/5)<\/p>\n<p>\u2022 <a href=\"#3.1\">\u041e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445 \u0442\u0438\u043f\u0430\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/a><\/p>\n<p>\u2022 <a href=\"#3.2\">Default \u2013 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e<\/a><\/p>\n<p>\u2022 <a href=\"#3.3\">Required \u2013 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f<\/a><\/p>\n<p>\u2022 <a href=\"#3.4\">Validator \u2013 \u0441\u0432\u043e\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f<\/a><\/p>\n<p>\u2022 <a href=\"#3.5\">\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u044e props \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u0445 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430\u0445<\/a><\/p>\n<p>\u2022 <a href=\"#3.6\">\u041f\u0440\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 props<\/a><\/p>\n<p>\u2022 <a href=\"#3.7\">\u0415\u0441\u0442\u044c \u043b\u0438 \u0441\u043c\u044b\u0441\u043b \u0432 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 default \u0438 required?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#4\"><strong>\u041f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 4\/5)<\/p>\n<p>\u2022 <a href=\"#4.1\">\u0425\u0443\u043a\u0438 \u0432\u043e Vue<\/a><\/p>\n<p>\u2022 <a href=\"#4.2\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f \u043e\u0434\u043d\u043e\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (One way data flow)?<\/a><\/p>\n<p>\u2022 <a href=\"#4.3\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 props drilling?\u00a0<\/a><\/p>\n<p>\u2022 <a href=\"#4.4\">\u041a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props, \u0430 \u043a\u043e\u0433\u0434\u0430 Vuex getters?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#5\"><strong>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/strong><\/a><\/p>\n<\/li>\n<\/ol>\n<p><a class=\"anchor\" name=\"1\" id=\"1\"><\/a><\/p>\n<h2>\u0420\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c\u0441\u044f \u0441 props<\/h2>\n<p><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 1\/5<\/strong><\/p>\n<p>\u0412\u044b\u0448\u0435 \u043c\u044b \u0443\u0436\u0435 \u0434\u0430\u043b\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435, \u0430 \u0442\u0435\u043f\u0435\u0440\u044c \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c\u0441\u044f \u0441 props \u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435.<\/p>\n<p>\u0414\u043e\u043f\u0443\u0441\u0442\u0438\u043c, \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u0441\u0430\u0439\u0442 \u043f\u0438\u0446\u0446\u0435\u0440\u0438\u0438, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043c\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u2026 \u043f\u0438\u0446\u0446\u0443.\u00a0<\/p>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;h2>Pizza 1&lt;\/h2>     &lt;ul>       &lt;li>Crust: Thin&lt;\/li>       &lt;li>Sauce: Marinara&lt;\/li>       &lt;li>Cheese: Mozzarella&lt;\/li>       &lt;li>Toppings: Pepperoni, Mushrooms, Green Peppers&lt;\/li>     &lt;\/ul>     &lt;h2>Pizza 2&lt;\/h2>     &lt;ul>       &lt;li>Crust: Thick&lt;\/li>       &lt;li>Sauce: BBQ&lt;\/li>       &lt;li>Toppings: Chicken, Bacon, Onions&lt;\/li>     &lt;\/ul>   &lt;\/div> &lt;\/template><\/code><\/pre>\n<p>\u041a\u043e\u0434 \u0432\u044b\u0448\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435 \u043b\u0443\u0447\u0448\u0438\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043e\u043d \u043d\u0435 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0437\u0430\u0445\u0430\u0440\u0434\u043a\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438 \u0441\u043b\u043e\u0436\u043d\u043e \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u041e\u0434\u043d\u0430\u043a\u043e \u0432\u043e Vue \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0443\u044e\u0441\u044f \u043b\u043e\u0433\u0438\u043a\u0443 \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0435\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 props. \u041a\u0430\u043a \u043c\u044b \u0443\u0436\u0435 \u0433\u043e\u0432\u043e\u0440\u0438\u043b\u0438 \u0432\u044b\u0448\u0435, props \u2014 \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue. \u0410 \u043e\u043d\u0430, \u0432 \u0441\u0432\u043e\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0438 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. Props \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u0432\u043c\u0435\u0441\u0442\u0435 \u043a\u0430\u043a \u043b\u0443\u0447\u0448\u0438\u0435 \u0434\u0440\u0443\u0437\u044c\u044f, \u043a\u0430\u043a \u0436\u0435\u043b\u0442\u044b\u0439 \u0438 \u043a\u0440\u0430\u0441\u043d\u044b\u0439 \u0438\u0437 \u044d\u043c\u0435\u043c\u0434\u0435\u043c\u0441, \u043a\u0430\u043a \u043f\u0435\u043b\u044c\u043c\u0435\u043d\u0438 \u0438 \u0441\u043c\u0435\u0442\u0430\u043d\u0430, \u043a\u0430\u043a \u043f\u0438\u0446\u0446\u0430 \u0438 \u0430\u043d\u0430\u043d\u0430\u0441\u044b, \u043a\u0430\u043a \u043a\u043e\u0442\u043b\u0435\u0442\u043a\u0438 \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439 \u2013 \u0438\u0434\u0443\u0442 \u0432\u043c\u0435\u0441\u0442\u0435 \u0438 \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u044f\u044e\u0442 \u0434\u0440\u0443\u0433 \u0434\u0440\u0443\u0433\u0430! =)  <\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/dcb\/b87\/438\/dcbb87438675350726874e7ffc128d6e.jpg\" alt=\"\u0412\u043a\u0443\u0441 \u043a\u043e\u0442\u043b\u0435\u0442\u043e\u043a \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439. \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" title=\"\u0412\u043a\u0443\u0441 \u043a\u043e\u0442\u043b\u0435\u0442\u043e\u043a \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439. \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" width=\"768\" height=\"768\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/dcb\/b87\/438\/dcbb87438675350726874e7ffc128d6e.jpg\" data-blurred=\"true\"\/><\/p>\n<div><figcaption>\u0412\u043a\u0443\u0441 \u043a\u043e\u0442\u043b\u0435\u0442\u043e\u043a \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439. \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;h2>{{ title }}&lt;\/h2>     &lt;ul>       &lt;li>Crust: {{ crust }}&lt;\/li>       &lt;li v-if=\"sauce\">Sauce: {{ sauce }}&lt;\/li>       &lt;li v-if=\"cheese\">Cheese: {{ cheese }}&lt;\/li>       &lt;li>Toppings:&lt;\/li>       &lt;ul>         &lt;li v-for=\"topping in toppings\" :key=\"topping\">{{ topping }}&lt;\/li>       &lt;\/ul>     &lt;\/ul>   &lt;\/div> &lt;\/template>  &lt;script> export default {   props: {     title: {       type: String,       required: true     },     isThick: {       type: Boolean,       default: true     },     sauce: {       type: String,       default: null     },     cheese: {       type: String,       default: \u201c     },     toppings: {       type: Array,       required: true     }   } } &lt;\/script><\/code><\/pre>\n<p>\u041c\u044b \u0441\u043e\u0437\u0434\u0430\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Pizza, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 5 props: <code>\u201ctitle\u201d, \u201ccrust\u201d, \u201csauce\u201d, \u201ccheese\u201d, \u201ctoppings\u201d.<\/code> \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u0435\u043c \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u043d\u0443\u0436\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0432 \u043d\u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043d\u0443\u0436\u043d\u044b\u0445 \u043d\u0430\u043c props. \u0412 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props \u0432\u043d\u0443\u0442\u0440\u0438 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 <code>&lt;template><\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 <code>{{ }}<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c <code>props<\/code> \u0441 \u0438\u043c\u0435\u043d\u0435\u043c \u201ccrust\u201d, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043a\u0430\u043a <code>{{ crust }}<\/code>.<\/p>\n<p>\u0422\u043e \u0435\u0441\u0442\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props \u0442\u0430\u043a \u0436\u0435, \u043a\u0430\u043a \u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435, \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0435 \u0432 data, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u041d\u043e \u0432\u0430\u0436\u043d\u043e \u0438\u043c\u0435\u0442\u044c \u0432 \u0432\u0438\u0434\u0443, \u0447\u0442\u043e props \u0434\u043e\u043b\u0436\u043d\u044b \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0434\u0430\u043d\u043d\u044b\u0435, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f, \u0438 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435.\u00a0<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043d\u0430\u043c \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u044d\u0442\u0438\u0445 props, \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0441\u0442\u0438\u043b\u0438, \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0435 props, \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u2013 \u043c\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043d\u0435\u0441\u0435\u043c \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Pizza! Chefs kiss ?!<\/p>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;Pizza title=\"Pizza 1\" :is-thick=\u201dfalse\u201d sauce=\"Marinara\" cheese=\"Mozzarella\" :toppings=\"['Pepperoni', 'Mushrooms', 'Green Peppers']\" \/>     &lt;Pizza :title=\"'Pizza 2'\" is-thick :sauce=\"'BBQ'\" :toppings=\"['Chicken', 'Bacon', 'Onions']\" \/>     &lt;Pizza title=\"Pizza 3\" crust=\"Thin\" :toppings=\"['Pepperoni']\" \/>   &lt;\/div> &lt;\/template>  &lt;script> import Pizza from '@\/components\/Pizza.vue'  export default {   components: {     Pizza   } } &lt;\/script><\/code><\/pre>\n<p>\u041a\u0442\u043e \u043c\u043e\u043b\u043e\u0434\u0435\u0446 \u0438 \u0437\u0430\u043c\u0435\u0442\u0438\u043b \u0432\u0441\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u044f? \u0420\u0430\u0434\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 props \u043f\u043e-\u0440\u0430\u0437\u043d\u043e\u043c\u0443, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u044f.\u00a0<\/p>\n<p>\u0417\u0430\u043e\u0441\u0442\u0440\u0438\u043c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 <code>title=\"Pizza 1\"<\/code> \u0438 <code>:title=\"'Pizza 2'\"<\/code>. \u0412 \u043f\u0435\u0440\u0432\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c String \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>\u201cPizza 1\u201d<\/code> \u043a\u0430\u043a \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u043c \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>\u201cPizza 2\u201d<\/code> \u043a\u0430\u043a \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 (\u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0435) \u0447\u0435\u0440\u0435\u0437 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0443 <code>v-bind:<\/code> (\u0438\u043b\u0438 \u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u043d\u043e <code>:<\/code> ).\u00a0<\/p>\n<p>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0441\u0435\u0433\u0434\u0430 \u0432\u044b \u0437\u0430\u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u0441\u044b\u043b\u0430\u0442\u044c props \u0438\u043c\u0435\u043d\u043d\u043e \u0447\u0435\u0440\u0435\u0437 \u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u043d\u044b\u0439 <code>\u201cv-bind:\u201d<\/code> (\u043a\u0430\u043a \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435) \u2013 \u0442\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0435\u0431\u044f \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u043e\u0442 \u0432\u043d\u0435\u0437\u0430\u043f\u043d\u044b\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0438 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u0441\u044f, \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043e String- \u0438 Boolean-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438. \u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u043d\u044e\u0430\u043d\u0441 \u0441 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435\u0439 Boolean:<\/p>\n<pre><code class=\"javascript\">&lt;PizzaItem is-hawaiian \/>  &lt;PizzaItem :is-hawaiian=\"true\" \/><\/code><\/pre>\n<p><a class=\"anchor\" name=\"2\" id=\"2\"><\/a><\/p>\n<p>\u0412 \u043e\u0431\u043e\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435<code>\u00a0\u201ctrue\u201d <\/code>\u2013 \u0438 \u0442\u0430\u043a\u043e\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0447\u0430\u0441\u0442\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u044f\u0441\u043d\u044b\u043c \u0438 \u043a\u0440\u0430\u0442\u043a\u0438\u043c.<\/p>\n<h2>\u0427\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 props \u0438 \u043d\u0435 \u0438\u0441\u043f\u043e\u0440\u0442\u0438\u0442\u044c \u0432\u0441\u0451<\/h2>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u043f\u0438\u0446\u0446\u0443, \u0432 \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u043a\u043e\u0439 \u0443\u0433\u043e\u0434\u043d\u043e \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442 \u0438 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043d\u0430 \u0432\u044b\u0445\u043e\u0434\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442! \u0412 \u043e\u0434\u043d\u0443 \u043f\u0438\u0446\u0446\u0443 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0441\u043e\u0443\u0441\u0430 \u043c\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0442\u043e\u043c\u0430\u0442\u043d\u0443\u044e \u043f\u0430\u0441\u0442\u0443, \u0432 \u0434\u0440\u0443\u0433\u0443\u044e \u2013 \u0441\u043e\u0443\u0441, \u0430 \u0432 \u0442\u0440\u0435\u0442\u044c\u0435\u0439 \u043e\u0431\u043e\u0439\u0434\u0435\u043c\u0441\u044f \u0431\u0435\u0437 \u043d\u0435\u0433\u043e.\u00a0<\/em><\/p>\n<\/blockquote>\n<p>Props \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043d\u0430\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439. \u0418\u0445\u00a0 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043b\u044e\u0431\u043e\u0433\u043e \u0442\u0438\u043f\u0430, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0438, \u0447\u0438\u0441\u043b\u0430, \u043e\u0431\u044a\u0435\u043a\u0442\u044b, \u043c\u0430\u0441\u0441\u0438\u0432\u044b \u0438 \u0434\u0430\u0436\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u041e\u043d\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445. Props \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u044e\u0442 \u043d\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435, \u043c\u0435\u043d\u044f\u044f\u0441\u044c, \u0438 \u043c\u0435\u043d\u044f\u044f \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u041f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 props, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043c\u043e\u0434\u0443\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u043b\u0435\u0433\u043a\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c\/\u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c (\u0447\u0442\u043e, \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0443 DRY \u2013 Don&#8217;t Repeat Yourself!)\u00a0 \u0438 \u0430\u0434\u0430\u043f\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0434\u0435\u043b\u0430\u044f \u043d\u0430\u0448 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u0433\u0438\u0431\u043a\u0438\u043c, \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u044b\u043c \u0438\u2026 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u043c.<\/p>\n<p><a class=\"anchor\" name=\"2.1\" id=\"2.1\"><\/a><\/p>\n<h3>\u041a\u0430\u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442?<\/h3>\n<p>\u041a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435, \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u043f\u0440\u043e\u0441\u0442\u043e \u0438 \u0442\u0430\u043a&#8230;\u00a0<\/p>\n<pre><code class=\"javascript\">props: {     name: String,     description: String,     price: Number }<\/code><\/pre>\n<p>&#8230;\u0438\u043b\u0438 \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c&#8230;<\/p>\n<pre><code class=\"javascript\">props: ['pizzaName', 'slicesCount']<\/code><\/pre>\n<p>&#8230;\u0447\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043d\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442 \u044d\u0442\u0443 \u00ab\u043f\u0438\u0446\u0446\u0443\u00bb:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/c83\/9c1\/409\/c839c14097da404242da4707b6ec4ae1.jpg\" width=\"640\" height=\"850\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c83\/9c1\/409\/c839c14097da404242da4707b6ec4ae1.jpg\" data-blurred=\"true\"\/><\/figure>\n<p><strong>\u041f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a \u043b\u0443\u0447\u0448\u0435 \u043d\u0435 \u0434\u0435\u043b\u0430\u0442\u044c?<\/strong><\/p>\n<ol>\n<li>\n<p>\u0412\u0430\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0442\u0438\u043f\u044b \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0437 props, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043b\u0435\u0433\u043a\u043e \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u0438 \u0431\u044b\u0441\u0442\u0440\u043e \u0438\u0445 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c.\u00a0<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438 \u0443\u0432\u0435\u043b\u0438\u0447\u0435\u043d\u0438\u0438 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u0430 props, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u043e\u0436\u043d\u0435\u0435 \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u043a\u0430\u043a\u0438\u0435 \u0438\u0437 \u043d\u0438\u0445 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b, \u0430 \u043a\u0430\u043a\u0438\u0435 \u043d\u0435\u0442, \u0438 \u043a\u0430\u043a\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043e\u043d\u0438 \u043c\u043e\u0433\u0443\u0442 \u0438\u043c\u0435\u0442\u044c. \u0427\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u044f\u0432\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e props. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u043b\u0435\u0433\u043a\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043f\u043e \u043c\u0435\u0440\u0435 \u0435\u0433\u043e \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u0445\u043e\u0440\u043e\u0448\u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f props \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u0445 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0435\u0433\u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0441\u0435\u0433\u0434\u0430 \u0432 camelCase (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, pizzaName) \u2013 \u044d\u0442\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445, \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0439 \u0432 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u043c\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 4 \u0442\u0438\u043f\u0430 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439. \u041a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043d\u0438\u0445 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0434\u0430\u043b\u0435\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<p>1) <strong>type<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0442\u0438\u043f\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0442\u043e \u0435\u0441\u0442\u044c, String, Number, Boolean, Object, Array, Date, Function. \u0415\u0449\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b, \u043d\u043e \u043f\u043e\u043a\u0430, \u0434\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430, \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0438\u043c\u0441\u044f \u043d\u0430 \u044d\u0442\u043e\u043c.<\/p>\n<p>2) <strong>default<\/strong> \u2013 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0435\u0441\u043b\u0438 \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u043e\u0441\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u043b\u0438 \u0438\u043c\u0435\u0435\u0442 undefined \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>3) <strong>required<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 undefined. \u0412\u044b\u0434\u0430\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0431\u044b\u043b\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043e.<\/p>\n<p>4) <strong>validator<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f. \u0422\u043e\u0436\u0435 \u0432\u044b\u0434\u0430\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u043f\u0440\u043e\u0439\u0434\u0435\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443.<\/p>\n<p>\u041e\u0431\u044b\u0447\u043d\u043e \u043d\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0432\u0441\u0435 4 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u0430 \u0441\u0440\u0430\u0437\u0443, \u043d\u043e \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c, \u0447\u0442\u043e \u0445\u043e\u0440\u043e\u0448\u0435\u0439 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435 \u0442\u0438\u043f\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e props, \u0430 default\/required (\u0445\u043e\u0442\u044f \u0431\u044b \u0447\u0442\u043e-\u0442\u043e \u043e\u0434\u043d\u043e \u0438\u0437 \u044d\u0442\u043e\u0433\u043e \u043a\u0440\u0430\u0439\u043d\u0435 \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e).<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u0438\u0437 props. \u041f\u043e\u043a\u0430 \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u0435\u0433\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u044b\u043c, \u043d\u043e \u043f\u043e \u043c\u0435\u0440\u0435 \u043f\u0440\u043e\u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u0441\u0442\u0430\u0442\u044c\u0435 \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0441\u0442\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u043c\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f\u043c\u0438 \u0438 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f\u043c\u0438. \u041c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u043f\u043e\u0439\u043b\u0435\u0440\u0438\u0442\u044c \u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043d\u0430 \u0433\u043e\u0442\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043a\u043e\u043d\u0446\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0438\u043b\u0438 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0438\u0441\u043a \u043f\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u00ab\u0444\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u0434\u00bb.<\/p>\n<pre><code class=\"javascript\">props: {     \/\/ String     pizzaName: {       type: String,     },      \/\/ Number      slicesCount: {       type: Number,     },      \/\/ Boolean     isHawaiian : {       type: Boolean,     },      \/\/ Array     toppings: {       type: Array,     },      \/\/ Object     pizzaItem: {       type: Object,     },      \/\/ \u0414\u0430\u0442\u044b delieveryDate: {   type: Date,  },   \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 props \u0441 \u043b\u044e\u0431\u044b\u043c \u0442\u0438\u043f\u043e\u043c, \u043b\u0438\u0448\u044c \u0431\u044b \u043d\u0435 undefined    definedProp: {      required: true,    }, };<\/code><\/pre>\n<p>\u0418 \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u043f\u0438\u0446\u0446\u044b \u0443 \u043d\u0430\u0441 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0432\u043e\u0442 \u0442\u0430\u043a\u043e\u0439:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/117\/539\/bea\/117539beaeaf1f0a67d8a84d2611d921.png\" alt=\"\u0423\u0436\u0435 \u043b\u0443\u0447\u0448\u0435 ?  \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" title=\"\u0423\u0436\u0435 \u043b\u0443\u0447\u0448\u0435 ?  \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" width=\"482\" height=\"640\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/117\/539\/bea\/117539beaeaf1f0a67d8a84d2611d921.png\"\/><\/p>\n<div><figcaption>\u0423\u0436\u0435 \u043b\u0443\u0447\u0448\u0435 ?  \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<h4>Vue 3, Composition API, TypeScript \u0438 props<\/h4>\n<p>\u0412\u043e Vue 3 \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f Composition API, \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u0439\u0441\u044f \u043e\u0442 \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u043e\u0433\u043e \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u0430 Vue 2 (\u0442\u0435\u043f\u0435\u0440\u044c \u2013 Options API), \u043e\u043d \u0431\u043e\u043b\u0435\u0435 \u043a\u0440\u0430\u0442\u043a\u0438\u0439, \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u0438 \u043b\u0430\u043a\u043e\u043d\u0438\u0447\u043d\u044b\u0439. \u0422\u0430\u043a\u0436\u0435 \u0435\u0433\u043e <a href=\"https:\/\/v2.vuejs.org\/v2\/guide\/migration-vue-2-7\"><u>\u0434\u043e\u0431\u0430\u0432\u0438\u043b\u0438<\/u><\/a> \u00ab\u043d\u0430 \u043f\u0440\u043e\u0431\u0443\u00bb \u0434\u043b\u044f Vue 2.17, \u043d\u043e \u044d\u0442\u043e \u043d\u0435 \u0441\u043e\u0432\u0441\u0435\u043c \u0442\u043e.<\/p>\n<p>\u0427\u0442\u043e \u043a\u0430\u0441\u0430\u0435\u0442\u0441\u044f props, \u0442\u043e \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 Vue 3 \u0441 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u043d\u044b\u043c <code>&lt;script><\/code> \u0432\u0441\u0435 \u0431\u0443\u0434\u0435\u0442 \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e. \u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0434\u043e\u0441\u0442\u0443\u043f \u043a props \u0447\u0435\u0440\u0435\u0437 setup:<\/p>\n<pre><code class=\"javascript\">props: {    pizzaName: {       type: String,        default: \"\",  },  },  setup(props) {    console.log(props.pizzaName)  }   <\/code><\/pre>\n<p>\u0412 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 Vue 3 \u0441 <code>&lt;script setup><\/code> \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c props \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0442\u0430\u043a \u0436\u0435, \u043d\u043e \u0438\u0445 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <code>defineProps<\/code> \u0442\u0430\u043a:<\/p>\n<pre><code class=\"javascript\">&lt;script setup> const props = defineProps({   pizzaName: {     type: String,     default: \"\",   }, }); &lt;\/script><\/code><\/pre>\n<p>\u0418\u043b\u0438 \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043a\u0440\u0430\u0442\u043a\u0438\u0439 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u0431\u0435\u0437 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043a \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 <code>const props<\/code>, \u043e\u0431\u0440\u0430\u0449\u0430\u044f\u0441\u044c \u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u043f\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044e:\u00a0<\/p>\n<pre><code class=\"javascript\">&lt;script setup> const props = defineProps({   pizzaName: {     type: String,     default: \"\",   }, }); &lt;\/script><\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 <code>&lt;script setup lang=\"ts\"><\/code> \u2013 TypeScript, \u0442\u043e \u043a\u0440\u043e\u043c\u0435 \u043e\u0431\u044b\u0447\u043d\u043e\u0433\u043e JS \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 (\u043a\u0430\u043a \u0432 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445 \u0432\u044b\u0448\u0435) \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"javascript\">const props = defineProps&lt;{   pizzaName: string   slicesCount?: number }>()<\/code><\/pre>\n<h4>Props \u0438 interface<\/h4>\n<p>\u0414\u043b\u044f \u0447\u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f interface \u0432 \u0441\u0432\u044f\u0437\u043a\u0435 \u0441 props? \u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u0430\u0431\u043e\u0440\u0430 \u043f\u0440\u0430\u0432\u0438\u043b, \u043a\u0430\u043a \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 props \u2013 <s>\u00a0\u044d\u043b\u0435\u0433\u0430\u043d\u0442\u043d\u043e!<\/s> \u041c\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435, \u0447\u0442\u043e \u0445\u043e\u0442\u0438\u043c \u043e\u0442 props \u0432 interface, \u0438 \u043c\u043e\u0436\u043d\u043e (\u0438 \u0434\u0430\u0436\u0435 \u043d\u0443\u0436\u043d\u043e) \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0447\u0435\u0440\u0435\u0437 \u0438\u043c\u043f\u043e\u0440\u0442.<\/p>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430, \u043f\u043b\u044e\u0441\u044b interface\u00a0 \u2013 \u0443\u043b\u0443\u0447\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430, \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u043a\u043e\u0434\u0430 \u0441\u043f\u0443\u0441\u0442\u044f \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u0440\u0443\u0433\u0438\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u0431\u044b\u0441\u0442\u0440\u043e \u0432\u043e\u0439\u0442\u0438 \u0432 \u043a\u0443\u0440\u0441 \u0434\u0435\u043b\u0430.<\/p>\n<pre><code class=\"javascript\">interface Pizza {   pizzaName: string   slicesCount?: number } const props = defineProps&lt;Pizza>()<\/code><\/pre>\n<h4>\u0414\u0435\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0437\u0430\u0446\u0438\u044f props \u0432 Vue 3.3<\/h4>\n<p>\u0412 \u0432\u0435\u0440\u0441\u0438\u0438 Vue 3.3 \u0437\u0430\u0432\u0435\u0437\u043b\u0438 \u043c\u043d\u043e\u0433\u043e \u0444\u0438\u0447, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435, \u043d\u043e \u043d\u0430\u0441 \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u0443\u0435\u0442 \u043e\u0434\u043d\u0430 \u2013 \u0434\u0435\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0437\u0430\u0446\u0438\u044f props \u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438. \u0415\u0441\u043b\u0438 \u0431\u044b \u0432\u044b \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b\u0438 \u0442\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0440\u0430\u043d\u0435\u0435, \u0442\u043e \u043f\u043e\u0442\u0435\u0440\u044f\u043b\u0438 \u0431\u044b \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u044d\u0442\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u043d\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u0435\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c. \u0412\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u044d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code class=\"javascript\">&lt;script setup lang=\"ts\"> const { pizzaName } = defineProps&lt;{     pizzaName: string}>()  \/\/\u041b\u044e\u0431\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c pizzaName  &lt;\/script>  &lt;template>   &lt;div>     \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435: {{ pizzaName }}   &lt;\/div> &lt;\/template><\/code><\/pre>\n<p><a class=\"anchor\" name=\"3\" id=\"3\"><\/a><\/p>\n<h2>\u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f props<\/h2>\n<p><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 3\/5<\/strong><\/p>\n<p>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u043e\u0432 \u0434\u043b\u044f props \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u0430 \u043f\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c \u043f\u0440\u0438\u0447\u0438\u043d\u0430\u043c:<\/p>\n<p>1. \u041e\u0431\u043d\u0430\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u043e\u0448\u0438\u0431\u043e\u043a \u043d\u0430 \u0440\u0430\u043d\u043d\u0435\u0439 \u0441\u0442\u0430\u0434\u0438\u0438. \u0421\u0440\u0435\u0434\u0441\u0442\u0432\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0438\u0432\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438, \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f props, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u0415\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 props \u043d\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u043a\u0440\u0438\u0442\u0435\u0440\u0438\u044f\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438, Vue \u0432\u044b\u0434\u0430\u0441\u0442 \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u043c\u043e\u0447\u044c \u0432\u0430\u043c \u0432\u044b\u044f\u0432\u0438\u0442\u044c \u0438 \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u043d\u0430 \u0440\u0430\u043d\u043d\u0435\u0439 \u0441\u0442\u0430\u0434\u0438\u0438, \u0447\u0442\u043e \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u0442 \u043a \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044e \u0431\u043e\u043b\u0435\u0435 \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0445 \u0438 \u0431\u0435\u0437\u043e\u0448\u0438\u0431\u043e\u0447\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/p>\n<p>2. \u0427\u0435\u0442\u043a\u0430\u044f \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f. \u0412\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u044b \u043c\u043e\u0433\u0443\u0442 \u0441\u043b\u0443\u0436\u0438\u0442\u044c \u0444\u043e\u0440\u043c\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u0434\u0440\u0443\u0433\u0438\u0445 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0445 \u0441 \u0432\u0430\u0448\u0438\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438. \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u044f \u043e\u0436\u0438\u0434\u0430\u0435\u043c\u044b\u0439 \u0442\u0438\u043f, \u0444\u043e\u0440\u043c\u0443 \u0438\u043b\u0438 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u044f props, \u0432\u044b \u043e\u0431\u043b\u0435\u0433\u0447\u0430\u0435\u0442\u0435 \u0434\u0440\u0443\u0433\u0438\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442.<\/p>\n<p>3. \u0423\u0434\u043e\u0431\u0441\u0442\u0432\u043e \u0441\u043e\u043f\u0440\u043e\u0432\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430. \u0412\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u044b \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0442 \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0446\u0435\u043b\u043e\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0432\u0430\u0448\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u0443\u044f, \u0447\u0442\u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0435 \u043f\u043e\u043b\u0443\u0447\u0430\u044e\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u043d\u0435\u043e\u0436\u0438\u0434\u0430\u043d\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435, \u0441\u0434\u0435\u043b\u0430\u0432 \u0432\u0430\u0448\u0443 \u043a\u043e\u0434\u043e\u0432\u0443\u044e \u0431\u0430\u0437\u0443 \u0431\u043e\u043b\u0435\u0435 \u0443\u0434\u043e\u0431\u043d\u043e\u0439 \u0434\u043b\u044f \u043e\u0431\u0441\u043b\u0443\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u0438 \u0443\u043f\u0440\u043e\u0449\u0430\u044e\u0449\u0435\u0439 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433.<\/p>\n<p><a class=\"anchor\" name=\"3.1\" id=\"3.1\"><\/a><\/p>\n<p>4. \u0423\u043b\u0443\u0447\u0448\u0435\u043d\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u041f\u0440\u043e\u0432\u0435\u0440\u044f\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f prop \u0438 \u0432\u044b\u044f\u0432\u043b\u044f\u044f \u043e\u0448\u0438\u0431\u043a\u0438 \u043d\u0430 \u0440\u0430\u043d\u043d\u0435\u0439 \u0441\u0442\u0430\u0434\u0438\u0438, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u0443\u0445\u0443\u0434\u0448\u0435\u043d\u0438\u044e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a \u043d\u0435\u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0435 \u043c\u0430\u043a\u0435\u0442\u044b \u0438\u043b\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n<h3>\u041e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445 \u0442\u0438\u043f\u0430\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/h3>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c, \u0447\u0442\u043e \u0432\u044b \u0441\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u044c \u0431\u043b\u044e\u0434\u043e. \u041c\u044b \u0431\u0435\u0440\u0435\u043c \u0440\u0435\u0446\u0435\u043f\u0442 \u0438 \u0441\u043b\u0435\u0434\u0443\u0435\u043c \u0435\u043c\u0443. \u0425\u043e\u0442\u0438\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0431\u043b\u0438\u043d\u0447\u0438\u043a\u0438 \u2013 \u0431\u0435\u0440\u0435\u043c \u043c\u0443\u043a\u0443, \u043c\u043e\u043b\u043e\u043a\u043e, \u0441\u043e\u043b\u044c, \u0441\u0430\u0445\u0430\u0440, \u044f\u0439\u0446\u0430 \u2013 \u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0431\u044b \u0432\u0441\u0435 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e? \u0415\u0441\u043b\u0438 \u043c\u044b \u0442\u0449\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043b\u0435\u0434\u0443\u0435\u043c \u0440\u0435\u0446\u0435\u043f\u0442\u0443, \u0442\u043e \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0432\u043a\u0443\u0441\u043d\u044b\u0435 \u0431\u043b\u0438\u043d\u044b, \u043f\u0440\u044f\u043c\u043e \u043a\u0430\u043a \u043d\u0430 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435. \u041d\u043e \u0435\u0441\u043b\u0438 \u043d\u0430\u0440\u0443\u0448\u0430\u0435\u043c \u0440\u0435\u0446\u0435\u043f\u0442 \u0438 \u0434\u0435\u043b\u0430\u0435\u043c \u043f\u043e-\u0441\u0432\u043e\u0435\u043c\u0443, \u0442\u043e \u0431\u043b\u0438\u043d\u044b \u043f\u043e\u0434\u0433\u043e\u0440\u0430\u044e\u0442, \u0440\u0432\u0443\u0442\u0441\u044f, \u043f\u043e\u043b\u0443\u0447\u0430\u044e\u0442\u0441\u044f \u0431\u0435\u0437\u0432\u043a\u0443\u0441\u043d\u044b\u043c\u0438 \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/em><\/p>\n<\/blockquote>\n<p>\u0410\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u0438 \u0441 props: \u0435\u0441\u043b\u0438 \u043c\u044b \u0432\u0432\u043e\u0434\u0438\u043c \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u044e \u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e, \u0442\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0448\u0430\u043d\u0441\u043e\u0432, \u0447\u0442\u043e \u043c\u044b \u0437\u0430\u043c\u0435\u0442\u0438\u043c \u043e\u0448\u0438\u0431\u043a\u0443 \u0431\u044b\u0441\u0442\u0440\u0435\u0435 \u0438 \u0441\u043c\u043e\u0436\u0435\u043c \u0435\u0435 \u043b\u0435\u0433\u043a\u043e \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c, \u0430 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u043d\u0430\u0441 \u043d\u0430\u043f\u0440\u0430\u0432\u044f\u0442 \u0432 \u044d\u0442\u043e\u043c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0438. \u0410\u0445, \u0435\u0441\u043b\u0438 \u0431\u044b \u0441 \u0431\u043b\u0438\u043d\u0430\u043c\u0438 \u0431\u044b\u043b\u043e \u0442\u0430\u043a \u0436\u0435 \ud83d\ude41<\/p>\n<p>\u041f\u0440\u043e \u0442\u0438\u043f\u044b \u043c\u043d\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043d\u0435\u0447\u0435\u0433\u043e \u2013 \u0442\u0438\u043f \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 \u0432 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0438 props, \u0438\u043d\u0430\u0447\u0435 \u0432\u044b\u0441\u043a\u043e\u0447\u0438\u0442 \u043e\u0448\u0438\u0431\u043a\u0430.<\/p>\n<p><strong>\u041c\u043e\u0436\u043d\u043e \u043b\u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0438\u0434\u043e\u0432 \u0442\u0438\u043f\u043e\u0432?<\/strong><\/p>\n<p>\u0414\u0430, \u0442\u0430\u043a\u0430\u044f \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u0430, \u043d\u043e \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0435\u0432, \u043a\u043e\u0433\u0434\u0430 \u044d\u0442\u043e \u043e\u043f\u0440\u0430\u0432\u0434\u0430\u043d\u043e, \u0441\u0442\u0440\u043e\u0433\u043e \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043e. \u00ab\u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043a\u043e\u0434\u0443 \u0431\u044b\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0433\u0438\u0431\u043a\u0438\u043c!\u00bb, \u2013 \u044d\u0442\u043e \u043e\u043f\u0440\u0430\u0432\u0434\u0430\u043d\u0438\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 TypeScript \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0432\u0435\u0437\u0434\u0435 \u0442\u0438\u043f <code>\u201cAny\u201d<\/code>.\u00a0 \u0418 \u0447\u0430\u0449\u0435 \u0432\u0441\u0435\u0433\u043e \u044d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0434\u043b\u044f \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0430 \u0438 \u043f\u0435\u0440\u0435\u0441\u043c\u043e\u0442\u0440\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430.<\/p>\n<p>\u041c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0442\u0438\u043f props <code>[String, Number]<\/code>, \u043d\u043e \u044d\u0442\u043e \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442 \u043d\u043e\u0432\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0440 \u0434\u043b\u044f \u043e\u0448\u0438\u0431\u043e\u043a. \u041c\u043e\u0436\u0435\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043f\u0435\u0440\u0432\u0443\u044e \u0436\u0435, \u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c <code>.split<\/code> \u043d\u0430 \u0441\u0442\u0440\u043e\u043a\u0435, \u043d\u043e \u043e\u043a\u0430\u0436\u0435\u0442\u0441\u044f \u0447\u0442\u043e \u0431\u044b\u043b\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043e \u0447\u0438\u0441\u043b\u043e.<\/p>\n<p>\u0418\u043b\u0438 \u043f\u043e\u043c\u043d\u0438\u0442\u0435, \u043a\u0430\u043a \u0432\u044b\u0448\u0435 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u043b\u0438 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u0438 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u0434\u0430\u043d\u043d\u044b\u0445? \u0415\u0441\u043b\u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c <code>:is-hawaiian=<\/code>&#171;<code>true<\/code>&#187; \u2013 \u044d\u0442\u043e <code>Boolean<\/code>, \u0430 \u0435\u0441\u043b\u0438 <code>is-hawaiian=<\/code>&#171;<code>true<\/code>&#171;, \u0442\u043e \u044d\u0442\u043e \u0443\u0436\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>String<\/code>. \u041f\u0440\u0430\u0432\u0434\u0430, \u0435\u0441\u043b\u0438 \u0435\u0441\u0442\u044c \u0445\u043e\u0440\u043e\u0448\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0439 \u043b\u0438\u043d\u0442\u0435\u0440, \u0438 \u0432\u044b \u0445\u043e\u0442\u044f \u0431\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043a\u043e\u0434 \u043d\u0435 \u0432 \u0431\u043b\u043e\u043a\u043d\u043e\u0442\u0435, \u0442\u043e \u044d\u0442\u0430 \u043e\u0448\u0438\u0431\u043a\u0430 \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0435\u043d\u0430. \u041a\u0430\u043a \u0432\u0438\u0434\u0438\u0442\u0435, \u043b\u0435\u0433\u043a\u043e \u0437\u0430\u043f\u0443\u0442\u0430\u0442\u044c\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043b\u0443\u0447\u0448\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043b\u0438\u0448\u044c \u043e\u0434\u0438\u043d \u0442\u0438\u043f props, \u043b\u0438\u0431\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e, \u0447\u0442\u043e\u0431\u044b \u043f\u043e \u043e\u0448\u0438\u0431\u043a\u0430\u043c \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438, \u043c\u044b \u043c\u043e\u0433\u043b\u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043d\u044f\u0442\u044c, \u0433\u0434\u0435 \u0436\u0435 \u0441\u043e\u0432\u0435\u0440\u0448\u0438\u043b\u0438 \u043e\u0448\u0438\u0431\u043a\u0443.<\/p>\n<p>\u041e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u043d\u0438\u044f \u0441\u0442\u043e\u0438\u0442 Boolean \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438 \u0438\u0445 \u043e\u0447\u0435\u0440\u0435\u0434\u043d\u043e\u0441\u0442\u044c \u0432 \u043c\u0443\u043b\u044c\u0442\u0438-\u0442\u0438\u043f\u0430\u0445.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435<\/p>\n<pre><code class=\"javascript\">&lt;MyComponent disabled \/><\/code><\/pre>\n<p>\u0438 \u043e\u0431\u044a\u044f\u0432\u043b\u044f\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u0430\u043a  <\/p>\n<pre><code class=\"javascript\"> props: {     disabled: [String, Boolean]   }<\/code><\/pre>\n<p>\u0442\u043e \u0432\u043c\u0435\u0441\u0442\u043e \u043e\u0436\u0438\u0434\u0430\u0435\u043c\u043e\u0433\u043e <code>disabled === true<\/code> \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c <code>disabled === \u2018\u2019<\/code>. \u041d\u043e \u0435\u0441\u043b\u0438 \u043c\u044b \u043e\u0431\u044a\u044f\u0432\u0438\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043a\u0430\u043a\u00a0<\/p>\n<pre><code class=\"javascript\"> props: {     disabled: [Number, Boolean]   }<\/code><\/pre>\n<p>\u0442\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>disabled === true<\/code>.\u00a0<\/p>\n<p><a class=\"anchor\" name=\"3.2\" id=\"3.2\"><\/a><\/p>\n<p>\u0427\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0435, \u043a\u0430\u043a \u0432\u0430\u043c \u0443\u0436\u0435 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0442\u0438\u043f \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f?<\/p>\n<h3>Default \u2013 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e<\/h3>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c: \u043c\u044b \u0433\u043e\u0442\u043e\u0432\u0438\u043c \u0448\u0430\u0443\u0440\u043c\u0443, \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0438 \u0432\u044b\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b, \u0438 (\u0432\u043d\u0435\u0437\u0430\u043f\u043d\u043e) \u043f\u043e\u043d\u0438\u043c\u0430\u0435\u043c, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u043a\u043e\u043d\u0447\u0438\u043b\u0438\u0441\u044c \u043b\u0438\u0441\u0442\u044c\u044f \u0441\u0430\u043b\u0430\u0442\u0430. \u041c\u044b \u043b\u0435\u0437\u0435\u043c \u0432 \u0445\u043e\u043b\u043e\u0434\u0438\u043b\u044c\u043d\u0438\u043a \u0438 \u0431\u0435\u0440\u0435\u043c \u043a\u0438\u0442\u0430\u0439\u0441\u043a\u0443\u044e \u043a\u0430\u043f\u0443\u0441\u0442\u0443, \u0437\u0430\u043c\u0435\u043d\u044f\u044f \u0435\u044e \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u044e\u0449\u0438\u0439 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u2026 \u0428\u0430\u0443\u0440\u043c\u0430 \u0441\u043f\u0430\u0441\u0435\u043d\u0430!<\/em><\/p>\n<\/blockquote>\n<p>\u0422\u043e\u0447\u043d\u043e \u0442\u0430\u043a \u0436\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0432\u043e Vue: \u043e\u043d\u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0431\u044b\u043b\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043e \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u0447\u0442\u043e \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u043d\u0435\u043d\u0443\u0436\u043d\u044b\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0438\u043b\u0438 \u043d\u0435\u043e\u0436\u0438\u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.\u00a0<\/p>\n<p>\u041d\u043e \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0434\u0430\u043d\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u043e\u0448\u0438\u0431\u043a\u0430\u043c\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 50 \u043c\u0435\u0441\u0442\u0430\u0445 \u0432 \u043a\u043e\u0434\u0435, \u0438 \u0432 40 \u0438\u0437 \u043d\u0438\u0445 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043e\u0434\u043d\u043e \u0438 \u0442\u043e \u0436\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438 \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432 40 \u0441\u043b\u0443\u0447\u0430\u044f\u0445. \u0412\u043c\u0435\u0441\u0442\u043e \u044d\u0442\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u0437 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043c\u044b \u0443\u043a\u0430\u0437\u0430\u043b\u0438.<\/p>\n<blockquote>\n<p><em>\u0418\u043b\u0438 \u0436\u0435 \u0432\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u043a \u043f\u0440\u0438\u043c\u0435\u0440\u0443 \u0441 \u0448\u0430\u0443\u0440\u043c\u043e\u0439 \u2013 \u043c\u044b \u041e\u0427\u0415\u041d\u042c \u0445\u043e\u0442\u0438\u043c \u043b\u0438\u0441\u0442\u044c\u044f \u0441\u0430\u043b\u0430\u0442\u0430, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0437\u0430\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0443 \u043a\u0443\u0440\u044c\u0435\u0440\u043e\u043c. \u0415\u0441\u043b\u0438 \u043a\u0443\u0440\u044c\u0435\u0440 \u043f\u0440\u0438\u0448\u0435\u043b, \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u044d\u0442\u043e\u0442 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442. \u0415\u0441\u043b\u0438 \u043a\u0443\u0440\u044c\u0435\u0440 \u043f\u043e \u043f\u0443\u0442\u0438 \u0437\u0430\u0431\u043b\u0443\u0434\u0438\u043b\u0441\u044f, \u043b\u0438\u0448\u0438\u0432 \u043d\u0430\u0441 \u0437\u0430\u043a\u0430\u0437\u0430, \u0447\u0442\u043e \u0436, \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043f\u0443\u0441\u0442\u044b.<\/em>\u00a0<\/p>\n<\/blockquote>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0441\u044b\u043b\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 \u0431\u044d\u043a \u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u043c\u0438, \u0438 \u043f\u043e\u043a\u0430 \u0438\u0445 \u043d\u0435\u0442, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e.<\/p>\n<p><a class=\"anchor\" name=\"3.3\" id=\"3.3\"><\/a><\/p>\n<p>Boolean-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0440\u0430\u0432\u043d\u044b <code>false<\/code> (\u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e), \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442 \u0432\u043e\u043f\u0440\u043e\u0441 \u2013 \u043d\u0443\u0436\u043d\u043e \u043b\u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u043d\u0438\u0445 <code>default: false<\/code>? \u0421 \u043e\u0434\u043d\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u043c\u044b \u0443\u043b\u0443\u0447\u0448\u0430\u0435\u043c \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430, \u0441\u043b\u0435\u0434\u0443\u044f \u0435\u0434\u0438\u043d\u043e\u043c\u0443 \u0441\u0442\u0438\u043b\u044e \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f props, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u0431\u0435\u0433\u0430\u0435\u043c \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u043b\u0438\u043d\u0442\u0435\u0440\u043e\u043c \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u0421 \u0434\u0440\u0443\u0433\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, Boolean \u0432\u043e\u043e\u0431\u0449\u0435 \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 default-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0442\u0430\u043a \u043a\u0430\u043a \u043e\u043d\u043e \u043b\u0438\u0431\u043e <code>false<\/code>, \u0435\u0441\u043b\u0438 \u043d\u0435 \u0443\u043a\u0430\u0437\u0430\u043d\u043e, \u0438 <code>true<\/code>, \u0435\u0441\u043b\u0438 \u0443\u043a\u0430\u0437\u0430\u043d\u043e.<\/p>\n<h3>Required \u2013 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f<\/h3>\n<blockquote>\n<p><em>\u041d\u043e \u0438\u043d\u043e\u0433\u0434\u0430 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u043a\u0430\u043a\u043e\u0439-\u043b\u0438\u0431\u043e \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442 \u043d\u0435\u043b\u044c\u0437\u044f \u0438\u043b\u0438 \u043d\u0435 \u0438\u043c\u0435\u0435\u0442 \u0441\u043c\u044b\u0441\u043b\u0430. \u0411\u0435\u0437 \u0447\u0435\u0433\u043e \u043d\u0435 \u0432\u044b\u0439\u0434\u0435\u0442 \u0448\u0430\u0443\u0440\u043c\u0430? \u0411\u0435\u0437 \u043b\u0430\u0432\u0430\u0448\u0430. \u0412\u044b \u0436\u0435 \u043d\u0435 \u0441\u0442\u0430\u043d\u0435\u0442\u0435 \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u044c \u0448\u0430\u0443\u0440\u043c\u0443, \u043a\u043e\u0433\u0434\u0430 \u0443 \u0432\u0430\u0441 \u043d\u0435\u0442 \u043b\u0430\u0432\u0430\u0448\u0430? \u041a\u043e\u043d\u0435\u0447\u043d\u043e, \u043d\u0435\u0442! \u0412\u043e\u0442 \u0442\u0443\u0442-\u0442\u043e \u0438 \u0432\u0441\u0442\u0443\u043f\u0430\u044e\u0442 \u0432 \u0438\u0433\u0440\u0443 \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f.<\/em><\/p>\n<\/blockquote>\n<p>\u041e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u043c\u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u0435\u0441\u043b\u0438 \u043c\u044b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0435\u043c \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u043a\u0430\u043a\u043e\u0439-\u043b\u0438\u0431\u043e \u0441\u043f\u0438\u0441\u043e\u043a \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f, \u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u043f\u043b\u043e\u0445\u043e\u0439 \u0438\u0434\u0435\u0435\u0439 \u0443\u043a\u0430\u0437\u0430\u0442\u044c <code>required<\/code>. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u043c\u044b \u043d\u0435 \u0441\u043c\u043e\u0433\u043b\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u0441\u043f\u0438\u0441\u043e\u043a, \u0441\u0440\u0430\u0437\u0443 \u0443\u0432\u0438\u0434\u0438\u043c \u043e\u0448\u0438\u0431\u043a\u0443. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0445\u043e\u0440\u043e\u0448\u0438\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0447\u0435\u0440\u0435\u0437 <code>v-if<\/code> \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u0422\u0430\u043a\u0436\u0435 \u0432\u0430\u0436\u043d\u043e \u0441\u043e\u0431\u043b\u044e\u0434\u0430\u0442\u044c \u0431\u0430\u043b\u0430\u043d\u0441 \u0438 \u043d\u0435 \u0443\u0432\u043b\u0435\u043a\u0430\u0442\u044c\u0441\u044f required-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u0442\u0430\u043a \u043a\u0430\u043a \u043f\u0435\u0440\u0435\u0438\u0437\u0431\u044b\u0442\u043e\u0447\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e required props \u0434\u0435\u043b\u0430\u044e\u0442 \u043a\u043e\u0434 \u0441\u043b\u043e\u0436\u043d\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u043c.\u00a0<\/p>\n<p>\u0412\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u043a \u043d\u0430\u0448\u0435\u043c\u0443 \u043a\u043e\u0434\u0443, \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0432 \u0435\u0433\u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0435\u0439 <code>default<\/code> \u0438 <code>required<\/code>.<\/p>\n<pre><code class=\"javascript\"> props: {     \/\/ String     pizzaName: {       type: String,       required: true,     },      \/\/ Number     slicesCount: {       type: Number,       default: 4,     },      \/\/ Boolean     isHawaiian : {       type: Boolean,       default: false,     },      \/\/ Array     toppings: {       type: Array,       required: true,     },      \/\/ Object     pizzaItem: {       type: Object,       required: true,     }, };<\/code><\/pre>\n<p><a class=\"anchor\" name=\"3.4\" id=\"3.4\"><\/a><\/p>\n<h3>Validator \u2013 \u0441\u0432\u043e\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f<\/h3>\n<blockquote>\n<p><em>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u043e\u043a\u0443\u043f\u0430\u0435\u043c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u044b \u043f\u043e \u0441\u043f\u0438\u0441\u043a\u0443 \u0440\u0435\u0446\u0435\u043f\u0442\u0430, \u0442\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442. \u0414\u043b\u044f \u043f\u0438\u0446\u0446\u044b \u043d\u0443\u0436\u043d\u043e \u0442\u0435\u0441\u0442\u043e \u2013 \u043d\u0430 \u0432\u044b\u0431\u043e\u0440 \u043b\u044e\u0431\u043e\u0435 \u0438\u0437 \u0442\u0440\u0435\u0445. \u0421\u043e\u0443\u0441? \u0425\u043e\u0447\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u0447\u0435\u0441\u043d\u043e\u0447\u043d\u044b\u0439 \u0438 \u043a\u0435\u0442\u0447\u0443\u043f, \u043b\u044e\u0431\u043e\u0439 \u0434\u0440\u0443\u0433\u043e\u0439 \u2013 \u043c\u0438\u043c\u043e. \u041a\u043e\u043b\u0431\u0430\u0441\u0430 \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0441\u0440\u043e\u043a \u0433\u043e\u0434\u043d\u043e\u0441\u0442\u0438. \u0422\u043e\u043c\u0430\u0442\u044b \u2013 \u00ab\u0444\u0440\u0443\u043a\u0442\u044b\u00bb \u0432 \u043c\u043e\u0435\u0439 \u043f\u0438\u0446\u0446\u0435? \u0411\u0440\u0440\u0440!<\/em><\/p>\n<\/blockquote>\n<p>Validator \u2013 \u0431\u043e\u043b\u0435\u0435 \u0442\u0449\u0430\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f. \u041e\u043d\u0430 \u0441\u043e\u0432\u0441\u0435\u043c \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u0430. \u041d\u043e \u044d\u0442\u043e \u0435\u0449\u0435 \u043e\u0434\u0438\u043d \u0441\u043f\u043e\u0441\u043e\u0431 \u0441\u043a\u0430\u0437\u0430\u0442\u044c \u0434\u0440\u0443\u0433\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0443, \u0447\u0442\u043e \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u0432\u0438\u0434\u0435\u0442\u044c \u0432 \u044d\u0442\u043e\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0438, \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0442\u043e \u0436\u0435 \u043f\u043e\u0448\u043b\u043e \u043d\u0435 \u0442\u0430\u043a. \u042d\u0442\u043e \u0435\u0449\u0435 \u043e\u0434\u0438\u043d \u0441\u043f\u043e\u0441\u043e\u0431 \u0443\u0437\u043d\u0430\u0442\u044c, \u0447\u0442\u043e \u043c\u044b \u0447\u0442\u043e-\u0442\u043e \u0441\u043b\u043e\u043c\u0430\u043b\u0438, \u0438 \u043d\u0435 \u043f\u043b\u043e\u0434\u0438\u0442\u044c \u0438\u043d\u0446\u0438\u0434\u0435\u043d\u0442\u044b \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435.<\/p>\n<p>\u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u0440 \u0434\u043b\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0432\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043d\u0430 \u043e\u0434\u0438\u043d \u0438\u0437 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432. \u041d\u043e\u0432\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0443 \u0431\u0443\u0434\u0435\u0442 \u044f\u0441\u043d\u043e, \u0447\u0442\u043e \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u043e\u0434\u043d\u043e \u0438\u0437 \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439:<\/p>\n<pre><code class=\"javascript\">shawermaSize: {       validator: function(value) {         return [\"normal\", \"xxl\", \"king\", \"adultStar\"].includes(value);       }     },<\/code><\/pre>\n<p>\u0411\u043e\u043d\u0443\u0441\u043e\u043c \u0438\u0434\u0435\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043d\u0430 \u043e\u0447\u0435\u043f\u044f\u0442\u043a\u0438.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0432 \u043c\u0430\u0441\u0441\u0438\u0432\u0435 \u043d\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u043a\u043b\u0430\u0441\u0441\u0443:<\/p>\n<p><a class=\"anchor\" name=\"3.5\" id=\"3.5\"><\/a><\/p>\n<pre><code class=\"javascript\">  validator: (dishes) => {      return dishes.every((dish) => dish instanceof Dish);    },<\/code><\/pre>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u044e props \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u0445 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430\u0445<\/h3>\n<p>\u041f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u0432 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 default-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0434\u043b\u044f props \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u0442\u044c\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0435 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0435 \u043d\u0435 \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u043e\u0439 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue. \u042d\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue \u043d\u0430\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u0432\u043d\u0435\u0441\u0435\u043d\u043d\u044b\u0435 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432, \u0430 \u043d\u0435 \u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432 \u0435\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u0438\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u0445.<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0440\u0435\u0448\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0434\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 default-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f props \u0432\u043c\u0435\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430. \u042d\u0442\u043e \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u0443\u0435\u0442, \u0447\u0442\u043e \u043d\u043e\u0432\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u0432\u043d\u0435\u0441\u0435\u043d\u043d\u044b\u0435 \u0432 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432, \u0431\u0443\u0434\u0443\u0442 \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0435\u043d\u044b \u0441\u0438\u0441\u0442\u0435\u043c\u043e\u0439 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue.<\/p>\n<p>\u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0434\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f prop:<\/p>\n<pre><code class=\"javascript\">props: {   myObject: {     type: Object,     default: function () {       return { prop1: 'default value 1', prop2: 'default value 2' }     }   } }<\/code><\/pre>\n<p>\u041a\u0430\u043a \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0434\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f prop:<\/p>\n<pre><code class=\"javascript\">props: {   myArray: {     type: Array,     default: function () {       return ['default value 1', 'default value 2']     }   } }<\/code><\/pre>\n<p><a class=\"anchor\" name=\"3.6\" id=\"3.6\"><\/a><\/p>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0434\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u043d\u043e\u0432\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f prop, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u0432\u043d\u0435\u0441\u0435\u043d\u043d\u044b\u0435 \u0432 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432, \u0431\u0443\u0434\u0443\u0442 \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0435\u043d\u044b \u0441\u0438\u0441\u0442\u0435\u043c\u043e\u0439 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue.<\/p>\n<h3>\u041f\u0440\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 props<\/h3>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 props \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u0414\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439 React \u2013 \u044d\u0442\u043e \u0432\u043f\u043e\u043b\u043d\u0435 \u043d\u043e\u0440\u043c\u0430 \u0438 \u043e\u0431\u044b\u0447\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434. \u0414\u043b\u044f Vue \u2013 \u044d\u0442\u043e \u0430\u043d\u0442\u0438-\u043f\u0430\u0442\u0442\u0435\u0440\u043d, \u0442\u0430\u043a \u043a\u0430\u043a \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 <code>emits<\/code> (\u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u0438\u0437 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442), \u0447\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u043c\u0443 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u043f\u043b\u043e\u0445\u043e\u0439 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u0438 \u0447\u0430\u0441\u0430\u043c \u0440\u0430\u0431\u043e\u0442\u044b \u0432 \u043f\u043e\u0438\u0441\u043a\u0430\u0445 \u043e\u0442\u0432\u0435\u0442\u0430 \u043d\u0430 \u0432\u043e\u043f\u0440\u043e\u0441 \u00ab\u043f\u043e\u0447\u0435\u043c\u0443 \u043e\u043d\u043e \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442?\u00bb. \u041d\u043e, \u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c, \u043d\u0430\u043c \u043d\u0430\u0434\u043e, \u0442\u043e\u0433\u0434\u0430:<\/p>\n<pre><code class=\"javascript\">logItemById(id) {       console.log(id)  }<\/code><\/pre>\n<p>\u041f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u044d\u0442\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442:<\/p>\n<pre><code class=\"javascript\">&lt;child-component v-for=\"item in items\" :key=\"item.id\" :item=\"item\"  :onLog=\"logItemById\" \/><\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u0438\u0437\u043d\u0443\u0442\u0440\u0438 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430:\u00a0<\/p>\n<p><a class=\"anchor\" name=\"3.7\" id=\"3.7\"><\/a><\/p>\n<pre><code class=\"javascript\">&lt;button @click=\"onLog(item.id)\">\u041e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c ID&lt;\/button><\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u0438\u0437 React, \u0442\u043e \u043b\u0443\u0447\u0448\u0435 \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 <a href=\"https:\/\/v3.ru.vuejs.org\/ru\/guide\/migration\/emits-option.html\"><u>\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 emits<\/u><\/a>.\u00a0<\/p>\n<h3>\u0415\u0441\u0442\u044c \u043b\u0438 \u0441\u043c\u044b\u0441\u043b \u0432 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 default \u0438 required?<\/h3>\n<p>\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0443 \u0432\u0441\u0435\u0445 props \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>required = false<\/code>. \u0415\u0441\u043b\u0438 \u043c\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c <code>true<\/code>, \u0442\u043e \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043e\u0431\u044f\u0437\u0430\u043d \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0437\u043d\u0430\u0447\u0438\u0442 \u0435\u0433\u043e \u043d\u0435\u043b\u044c\u0437\u044f \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u043a\u0430\u043a\u0438\u043c-\u0442\u043e \u0434\u0440\u0443\u0433\u0438\u043c \u043f\u0443\u0441\u0442\u044b\u043c.<\/p>\n<p>\u0418 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438, \u0435\u0441\u043b\u0438 \u043c\u044b \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c default-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0442\u043e \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435 <code>required<\/code> \u0443\u0436\u0435 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u043d\u044b\u043c, \u0432\u0435\u0434\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u0435\u0441\u0442\u044c \u0438 \u043e\u043d\u043e \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0441\u044f, \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043e\u0442\u0440\u0438\u0441\u0443\u0435\u0442\u0441\u044f. \u041d\u043e \u043e\u0448\u0438\u0431\u043a\u0430 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0432\u0438\u0441\u0435\u0442\u044c, \u0435\u0441\u043b\u0438 \u043c\u044b \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0434\u0438\u043c \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0440\u0435\u0434\u043a\u0438\u0439 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0439 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0439, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u0431\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u044b. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043a\u043e\u0434 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u043b\u0441\u044f \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c\u0443 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u044e, \u0432 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043e \u043d\u0435 \u0431\u044b\u043b\u043e, \u043d\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0431\u044b\u043b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u0430\u043d, \u0445\u043e\u0442\u044c \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u043b \u043e\u0448\u0438\u0431\u043a\u0443 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438. \u0418\u043b\u0438 \u0435\u0441\u043b\u0438 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0435\u0432 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u0441 default-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u0438 \u0431\u0435\u0437.<\/p>\n<blockquote>\n<p><em>\u0410\u043d\u0430\u043b\u043e\u0433 \u0438\u0437 \u043c\u0438\u0440\u0430 <s>\u0432\u044b\u0441\u043e\u043a\u043e\u0439<\/s> \u043a\u0443\u0445\u043d\u0438 \u2013 \u043d\u0430\u043c \u0432\u0434\u0440\u0443\u0433 \u0440\u0435\u0437\u043a\u043e \u0437\u0430\u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u043d\u043e\u0447\u044c\u044e \u043f\u043e\u0435\u0441\u0442\u044c \u0447\u0435\u0433\u043e-\u0442\u043e \u0441\u043b\u0430\u0434\u043a\u043e\u0433\u043e, \u043d\u043e \u0432 \u0445\u043e\u043b\u043e\u0434\u0438\u043b\u044c\u043d\u0438\u043a\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u0443\u0442\u0435\u0440\u044b \u0441 \u043c\u0430\u0439\u043e\u043d\u0435\u0437\u043e\u043c \u0438 \u043a\u043e\u043b\u0431\u0430\u0441\u043a\u043e\u0439. \u041c\u044b, \u043a\u043e\u043d\u0435\u0447\u043d\u043e, \u0438\u0445 \u0441\u044a\u0435\u0434\u0438\u043c \u0438 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0443\u0441\u043f\u043e\u043a\u043e\u0438\u043c\u0441\u044f. \u041d\u043e \u0441\u043b\u0430\u0434\u043a\u043e\u0433\u043e \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u2013 \u0431\u0443\u0434\u0442\u043e \u0437\u0430\u0433\u043e\u0440\u0430\u0435\u0442\u0441\u044f \u043b\u0430\u043c\u043f\u043e\u0447\u043a\u0430 \u0441 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\u043c \u043e\u0431 \u043e\u0448\u0438\u0431\u043a\u0435.<\/em><\/p>\n<\/blockquote>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/3e0\/7e7\/7c3\/3e07e77c336e5af21dea6cfaad59a3dd.jpg\" alt=\"\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" title=\"\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" width=\"768\" height=\"768\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3e0\/7e7\/7c3\/3e07e77c336e5af21dea6cfaad59a3dd.jpg\" data-blurred=\"true\"\/><\/p>\n<div><figcaption>\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<h4>\u0424\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u0434<\/h4>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u043d\u0430\u0448 \u043a\u043e\u0434 \u0441\u043e \u0432\u0441\u0435\u043c\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f\u043c\u0438 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n<pre><code class=\"javascript\"> props: {     \/\/ String     pizzaName: {       type: String,       required: true,       validator: (value) => value.length > 0,     },      \/\/ Number      slicesCount: {       type: Number,       default: 4,       validator: (value) => value >= 0,     },      \/\/ Boolean     isHawaiian: {       type: Boolean,       default: false, \/\/ \u041f\u043e\u043c\u043d\u0438\u043c \u043f\u043e\u0447\u0435\u043c\u0443 \u0437\u0434\u0435\u0441\u044c \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e     },      \/\/ Array     toppings: {       type: Array,       default: () => [],       validator: (value) => value.length > 0,     },      \/\/ Object     pizzaItem: {       type: Object,       default: () => ({}),       validator: (value) => value.name,     },          \/\/ \u0414\u0430\u0442\u044b     delieveryDate: {     type: Date,      validator: function(value) {     const dateRegex = \/^\\d{2}-\\d{2}$\/;     if (!value.match(dateRegex)) return false;     const date = new Date(value);     return date instanceof Date &amp;&amp; !isNaN(date);     }     },      \/\/ Function - \u0430\u043d\u0442\u0438-\u043f\u0430\u0442\u0442\u0435\u0440\u043d     onClick: {       type: Function,       default: () => {},     },      \/\/ \u0422\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c Component     component: {       type: [Object, Function],       default: () => {},     },      \/\/ \u041c\u043e\u0436\u043d\u043e \u0434\u0430\u0436\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u043a\u043b\u0430\u0441\u0441\u044b pizzaClass: {       type: PizzaClass,       required: true,       validator: (value) => value instanceof PizzaClass,     },      \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 Props \u0441 \u043b\u044e\u0431\u044b\u043c \u0442\u0438\u043f\u043e\u043c, \u043b\u0438\u0448\u044c \u0431\u044b \u043d\u0435 undefined     definedProp: {       required: true,     }, };<\/code><\/pre>\n<h4>\u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432 Composition API<\/h4>\n<p>\u0412\u044b\u0433\u043b\u044f\u0434\u044f\u0442 \u0442\u043e\u0447\u043d\u043e \u0442\u0430\u043a \u0436\u0435 \u043a\u0430\u043a \u0438 \u0432 Options API, \u0447\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u0443\u0434\u043e\u0431\u043d\u043e \u0438 \u043f\u043e\u043d\u044f\u0442\u043d\u043e, \u0440\u0430\u0437 \u0432\u044b \u043e\u0431\u044a\u044f\u0432\u0438\u043b\u0438 props, \u0442\u043e \u0432\u043d\u0443\u0442\u0440\u0438 \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u0442\u043e\u043c\u0443, \u043a\u0430\u043a \u0432\u044b \u0434\u0435\u043b\u0430\u043b\u0438 \u044d\u0442\u043e \u0432 Options API.<\/p>\n<p><a class=\"anchor\" name=\"4\" id=\"4\"><\/a><\/p>\n<pre><code class=\"javascript\">const props = defineProps({   pizzaName: {     type: String,     required: true,     validator: (value) => value.length > 0,   }, });<\/code><\/pre>\n<p><a class=\"anchor\" name=\"4.1\" id=\"4.1\"><\/a><\/p>\n<h2>\u041f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 props<\/h2>\n<p><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 4\/5<\/strong><\/p>\n<h3>\u0425\u0443\u043a\u0438 \u0432\u043e Vue<\/h3>\n<p>\u0412 \u043a\u0430\u043a\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f props? \u041d\u0430 \u044d\u0442\u0430\u043f\u0435 created-\u0445\u0443\u043a\u0430, \u0438 \u0442\u0443\u0442 \u0436\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0435\u0441\u043b\u0438 \u043e\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u0412 \u043f\u0440\u043e\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 default value.<\/p>\n<p>\u0412\u0430\u0436\u043d\u043e \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u043a\u043e\u0433\u0434\u0430 prop \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 prop \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043f\u0435\u0440\u0435\u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u0432 \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u0447\u0438\u043a\u0435 <code>beforeCreate<\/code>. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043a \u043c\u043e\u043c\u0435\u043d\u0442\u0443 \u0432\u044b\u0437\u043e\u0432\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u0447\u0438\u043a\u0430 prop \u0431\u0443\u0434\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0430 \u043d\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0431\u044b\u043b \u0432\u043e\u043f\u0440\u043e\u0441, \u0432\u043b\u0438\u044f\u0435\u0442 \u043b\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0438 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043b\u0438 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u0442\u043e \u043e\u0442\u0432\u0435\u0442 \u2013 \u043d\u0435\u0442, \u043d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442, \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0442\u043e\u0436\u0435 \u043d\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442.\u00a0<\/p>\n<p><a class=\"anchor\" name=\"4.2\" id=\"4.2\"><\/a><\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043c\u044b \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u043c \u043a\u0430\u043a\u0438\u0435-\u043b\u0438\u0431\u043e \u043c\u0430\u043d\u0438\u043f\u0443\u043b\u044f\u0446\u0438\u0438 \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u043c\u0438 \u043a\u0430\u043a props \u043d\u0430 \u043f\u043e\u0437\u0434\u043d\u0438\u0445 \u0445\u0443\u043a\u0430\u0445 (\u0432\u0440\u043e\u0434\u0435 <code>mounted<\/code>), \u0442\u043e props \u0442\u0430\u043a\u0436\u0435 \u0431\u0443\u0434\u0443\u0442 \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u0430\u043d\u044b \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d.\u00a0<\/p>\n<h3>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f \u043e\u0434\u043d\u043e\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (One way data flow)?<\/h3>\n<p>Props \u0434\u043e\u043b\u0436\u043d\u044b \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0434\u0430\u043d\u043d\u044b\u0435, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f, \u0438 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u0422\u043e \u0435\u0441\u0442\u044c \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c props \u0432\u043d\u0443\u0442\u0440\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u043c\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 (mutable object), \u043d\u043e \u044d\u0442\u043e \u0441\u0442\u0440\u043e\u0433\u043e \u043d\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f, \u0442\u0430\u043a \u043a\u0430\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043d\u0435\u043f\u0440\u0435\u0434\u0432\u0438\u0434\u0435\u043d\u043d\u044b\u043c \u043f\u043e\u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u044f\u043c, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0434\u0435\u0442 \u0432\u0440\u0430\u0437\u0440\u0435\u0437 \u0441 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u043e\u043c \u043e\u0434\u043d\u043e\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044e. \u041c\u044b \u0437\u0430\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u0432 \u0440\u0435\u0441\u0442\u043e\u0440\u0430\u043d\u0435 \u043c\u0430\u043a\u0430\u0440\u043e\u043d\u044b \u043f\u043e-\u0444\u043b\u043e\u0442\u0441\u043a\u0438 \u0441\u043e \u0441\u043f\u0430\u0433\u0435\u0442\u0442\u0438 \u0438 \u0444\u0430\u0440\u0448\u0435\u043c, \u043e\u0431\u0436\u0430\u0440\u0435\u043d\u043d\u044b\u043c \u0441 \u043a\u0443\u0441\u043e\u0447\u043a\u0430\u043c\u0438 \u043a\u0440\u0430\u0441\u043d\u043e\u0433\u043e \u043f\u0435\u0440\u0446\u0430 \u0438 \u043f\u043e\u0441\u044b\u043f\u0430\u043d\u043d\u044b\u043c \u0443\u043a\u0440\u043e\u043f\u043e\u043c \u0441\u0432\u0435\u0440\u0445\u0443. \u041c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0441\u0432\u043e\u0439 \u0437\u0430\u043a\u0430\u0437 \u0438 \u0441\u0430\u0434\u0438\u043c\u0441\u044f \u0432 \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u0438 \u0431\u043b\u044e\u0434\u0430. \u041d\u043e \u0432\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u044c \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b, \u043a\u0430\u043a \u043c\u044b \u0442\u043e\u0433\u043e \u043e\u0436\u0438\u0434\u0430\u0435\u043c, \u043f\u043e\u0432\u0430\u0440 \u043b\u043e\u043c\u0430\u0435\u0442 \u0441\u043f\u0430\u0433\u0435\u0442\u0442\u0438 \u043d\u0430 \u0447\u0435\u0442\u044b\u0440\u0435 \u0447\u0430\u0441\u0442\u0438, \u0437\u0430\u0442\u0435\u043c \u0437\u0430\u043c\u0435\u043d\u044f\u0435\u0442 \u0444\u0430\u0440\u0448 \u043d\u0430 \u043a\u043e\u043b\u0431\u0430\u0441\u0443, \u0430 \u043f\u0435\u0440\u0435\u0446 \u0438 \u0443\u043a\u0440\u043e\u043f \u043d\u0430 \u043b\u0443\u043a. \u0412 \u0438\u0442\u043e\u0433\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0441\u043e\u0432\u0441\u0435\u043c \u043d\u0435 \u0442\u043e \u0431\u043b\u044e\u0434\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0445\u043e\u0442\u0435\u043b\u0438 \u0431\u044b.\u00a0<\/em><\/p>\n<\/blockquote>\n<p>\u0427\u0442\u043e \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u043e? \u041f\u043e\u0432\u0430\u0440 (\u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442) \u0438\u0437\u043c\u0435\u043d\u0438\u043b \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442\u044b \u043d\u0430 \u0441\u0432\u043e\u0439 \u043b\u0430\u0434 (\u043f\u0435\u0440\u0435\u043f\u0438\u0441\u0430\u043b props), \u0445\u043e\u0442\u044f \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043d\u0430\u0441 (\u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442) \u043f\u0435\u0440\u0435\u0434 \u044d\u0442\u0438\u043c. \u041a\u0430\u043a \u0431\u044b \u043f\u043e\u0432\u0430\u0440 \u0441\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u0442 \u043f\u043e\u0432\u0430\u0440\u0430: \u0447\u0442\u043e \u043d\u0430\u0441\u0447\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0442\u0438\u043f \u043c\u044f\u0441\u0430 \u043d\u0430 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u043d\u043e \u0434\u0440\u0443\u0433\u043e\u0439 (<code>this.$emit('change-meat-type', '\u041a\u043e\u043b\u0431\u0430\u0441\u0430'<\/code>)? \u041c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u044d\u0442\u043e\u0442 \u0437\u0430\u043f\u0440\u043e\u0441 \u0438 \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u043c \u043d\u0430 \u043d\u0435\u0433\u043e: \u00ab\u0414\u0430, \u0434\u0430\u0432\u0430\u0439\u00bb, \u043c\u0435\u043d\u044f\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043c\u044f\u0441\u0430 \u0441 \u0444\u0430\u0440\u0448\u0430 \u043d\u0430 \u043a\u043e\u043b\u0431\u0430\u0441\u0443 \u0438 \u0432 \u0438\u0442\u043e\u0433\u0435 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0442\u043e, \u0447\u0442\u043e \u043c\u044b \u043e\u0436\u0438\u0434\u0430\u0435\u043c. \u0418\u043b\u0438 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432 \u0433\u043e\u043b\u043e\u0432\u0435 \u00a0<code>(\"return acceptableMeats.includes('\u043a\u043e\u043b\u0431\u0430\u0441\u0430')\")<\/code> \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c \u043e\u0442\u043a\u0430\u0437.<\/p>\n<p>\u041f\u0440\u0438\u043d\u0446\u0438\u043f \u043e\u0434\u043d\u043e\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u0447\u0442\u043e props \u0432 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b\u043c\u0438 \u0438 \u0438\u0445 \u043b\u0435\u0433\u043a\u043e \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u043e\u043d\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b\u043c \u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u043c\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c. \u0421\u043e\u0445\u0440\u0430\u043d\u044f\u044f \u043d\u0430\u0448 \u043f\u043e\u0442\u043e\u043a \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0434\u043d\u043e\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u043c, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u0442\u0440\u0443\u0434\u043d\u043e\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0434\u043b\u044f \u043e\u0442\u043b\u0430\u0434\u043a\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0443\u0442\u044c \u0438\u0437-\u0437\u0430 \u0434\u0432\u0443\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0439 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0444\u043e\u0440\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u043c\u043e\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f.<\/p>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432\u0432\u0435\u0440\u0445 \u043f\u043e \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434 <code>this.$emit()<\/code>. \u042d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0434\u0432\u0430 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430 \u2013 \u0438\u043c\u044f \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0438 \u0434\u0430\u043d\u043d\u044b\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u044b \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043a\u043d\u043e\u043f\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u044f\u0442\u044c \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043d\u0435\u0433\u043e, \u0432\u044b \u043c\u043e\u0433\u043b\u0438 \u0431\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"javascript\">&lt;button @click=\"$emit('change-meat-type', 'newMeat')\">\u0417\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u043c\u044f\u0441\u043e&lt;\/button><\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 <code>@click<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043b\u0443\u0448\u0438\u0432\u0430\u043d\u0438\u044f \u0441\u043e\u0431\u044b\u0442\u0438\u044f <code>click<\/code> \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0435. \u041f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434 <code>this.$emit()<\/code> \u0441 \u0438\u043c\u0435\u043d\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u044f (\u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438) \u0438 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u044b \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 (&#8216;\u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435&#8217;).<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u043c\u043e\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0443 <code>\u201cv-on\u201d<\/code> (\u0438\u043b\u0438 \u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u043d\u043e <code>@<\/code>) \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043b\u0443\u0448\u0438\u0432\u0430\u043d\u0438\u044f \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0438 \u0432\u044b\u0437\u043e\u0432\u0430 \u043c\u0435\u0442\u043e\u0434\u0430 \u043f\u0440\u0438 \u0435\u0433\u043e \u0441\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;meat-component :meat=\"meat\" @change-meat-type=\"handleMyMeat($event)\">&lt;\/meat-component>   &lt;\/div> &lt;\/template>  &lt;script> import MeatComponent from '.\/MeatComponent.vue';  export default {   components: {     MeatComponent,   },   data() {     return {         meat: \"\u0424\u0430\u0440\u0448\"     }   },   methods: {     handleMyMeat(value) {         const acceptableMeats = ['\u0424\u0430\u0440\u0448', '\u0418\u043d\u0434\u0435\u0439\u043a\u0430', '\u041f\u043e\u0434\u043e\u0437\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043c\u044f\u0441\u043e'];         if (acceptableMeats.includes(value)) {             this.meat = value         };         \/\/ \u0411\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u0430\u044f \u0437\u0430\u043f\u0438\u0441\u044c - acceptableMeats.includes(value) ? this.meat = value : null;     },   }, }; &lt;\/script><\/code><\/pre>\n<p><a class=\"anchor\" name=\"4.3\" id=\"4.3\"><\/a><\/p>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 MeatComponent \u0438 \u043f\u0440\u043e\u0441\u043b\u0443\u0448\u0438\u0432\u0430\u0435\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043d\u0430\u0436\u0430\u0442\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0443 <code>@change-meat-type<\/code>. \u041a\u043e\u0433\u0434\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0438\u043d\u0438\u0446\u0438\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434 <code>handleMyMeat<\/code> \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438, \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0438\u0437 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430.<\/p>\n<h3>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 props drilling?\u00a0<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/482\/9b5\/ebd\/4829b5ebd4e8176d77673d5b94b719b7.jpg\" alt=\"\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" title=\"\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2\" width=\"768\" height=\"768\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/482\/9b5\/ebd\/4829b5ebd4e8176d77673d5b94b719b7.jpg\" data-blurred=\"true\"\/><\/p>\n<div><figcaption>\u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c, \u0447\u0442\u043e \u0432\u044b \u0448\u0435\u0444-\u043f\u043e\u0432\u0430\u0440 \u043d\u0430 \u043a\u0443\u0445\u043d\u0435, \u0438 \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u043f\u043e\u0432\u0430\u0440\u0443 \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u0441\u043e\u043b\u0438\u0442\u044c \u0441\u0432\u043e\u0435 \u0431\u043b\u044e\u0434\u043e. \u041e\u0434\u0438\u043d \u043f\u043e\u0432\u0430\u0440 \u0431\u0435\u0440\u0435\u0442 \u0441\u043e\u043b\u043e\u043d\u043a\u0443, \u0441\u043e\u043b\u0438\u0442 \u0431\u043b\u044e\u0434\u043e \u0441\u043e\u0441\u0435\u0434\u043d\u0435\u0433\u043e \u043f\u043e\u0432\u0430\u0440\u0430, \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442 \u0435\u043c\u0443 \u0441\u043e\u043b\u043e\u043d\u043a\u0443, \u0442\u043e\u0442 \u0441\u043e\u043b\u0438\u0442 \u0431\u043b\u044e\u0434\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u0441\u043e\u0441\u0435\u0434\u0430. \u0418 \u0442\u0430\u043a \u043f\u043e \u0446\u0435\u043f\u043e\u0447\u043a\u0435 \u0434\u043e \u0441\u0430\u043c\u043e\u0433\u043e \u043a\u043e\u043d\u0446\u0430. \u0410 \u043a\u0430\u043a \u043d\u0430\u0441\u0447\u0435\u0442 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0441\u043e\u043b\u043e\u043d\u043a\u0430 \u0441\u0442\u043e\u044f\u043b\u0430 \u0432 \u0446\u0435\u043d\u0442\u0440\u0435 \u043a\u0443\u0445\u043d\u0438, \u0447\u0442\u043e\u0431\u044b \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u043e\u0432\u0430\u0440 \u043c\u043e\u0433 \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e \u0432\u0437\u044f\u0442\u044c \u0438 \u043f\u043e\u0441\u043e\u043b\u0438\u0442\u044c \u0441\u0432\u043e\u0435 \u0431\u043b\u044e\u0434\u043e?<\/em><\/p>\n<\/blockquote>\n<p>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0430 props \u043e\u0442 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u043a \u0431\u043e\u043b\u0435\u0435 \u0433\u043b\u0443\u0431\u043e\u043a\u043e \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u043c\u0443 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0441\u043b\u043e\u0436\u043d\u0435\u0435 \u0438 \u043c\u0435\u043d\u0435\u0435 \u043f\u043e\u043d\u044f\u0442\u043d\u043e\u0439, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u043d\u0430 \u0431\u043e\u043b\u044c\u0448\u0435\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438. \u041d\u043e \u0447\u0435\u043c \u0434\u0430\u043b\u044c\u0448\u0435 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c props, \u0442\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0443 \u043d\u0430\u0441 \u0442\u0440\u0443\u0434\u043d\u043e\u0441\u0442\u0435\u0439 \u0432 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u0438, \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0438 \u0438 \u043e\u0442\u043b\u0430\u0434\u043a\u0435 \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439. \u0422\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u0431\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e, \u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f props, \u0438, \u0447\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0446\u0435\u043f\u043e\u0447\u043a\u0430 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0442\u0435\u043c, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u0441\u0435\u0431\u0435, \u0445\u0443\u0436\u0435.<\/p>\n<p>\u0412 \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u043d\u0430\u0448\u0438\u0445 <a href=\"https:\/\/vk.com\/@simbirsoft-kak-spravitsya-s-property-drilling-i-nachat-zhit\"><u>\u0441\u0442\u0430\u0442\u0435\u0439<\/u><\/a> \u043c\u044b \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u044b\u0432\u0430\u043b\u0438 \u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u0445 props drilling, \u043d\u043e \u0445\u043e\u0442\u044c \u043e\u043d\u0430 \u0438 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c, \u044d\u0442\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u043e\u0431\u0449\u0430\u044f \u0434\u043b\u044f \u043e\u0431\u043e\u0438\u0445 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u0432.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e \u0441\u0435\u0440\u044c\u0435\u0437\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u043c\u043e\u0436\u0435\u0442 \u0432\u0430\u0440\u044c\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412 \u0446\u0435\u043b\u043e\u043c props drilling \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0431\u043e\u0301\u043b\u044c\u0448\u0435\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439 \u0432 React \u0438\u0437-\u0437\u0430 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435\u043c Vuex \u0432 Vue.<\/p>\n<p>\u041a\u0430\u043a \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u0443 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0447\u0435\u0440\u0435\u0437 props \u0432 Vue \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0435 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435 (Vuex store, \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043c\u044b \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0438\u043b\u0438 Pinia, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0441\u0435\u0439\u0447\u0430\u0441 \u043b\u0443\u0447\u0448\u0435\u0439 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043e\u0439 \u0434\u043b\u044f \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430, \u043d\u043e \u043f\u0440\u0438\u043d\u0446\u0438\u043f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 getters \u0442\u0430\u043c \u0442\u043e\u0442 \u0436\u0435)<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0431\u043b\u044e\u0434, \u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u0438\u043b\u0438 \u043e\u0431\u044a\u0435\u043c\u043d\u0430\u044f \u043b\u0438\u0447\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u0442\u043e \u043d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0435\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u0447\u0435\u0440\u0435\u0437 props. Getters \u0432 Vuex \u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0442\u0430\u043a \u0436\u0435, \u043a\u0430\u043a \u0438 computed \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432 Vue, \u043f\u043e\u044d\u0442\u043e\u043c\u0443, \u0435\u0441\u043b\u0438 \u0432\u044b \u043e\u0431\u0440\u0430\u0449\u0430\u0435\u0442\u0435\u0441\u044c \u043a \u043e\u0434\u043d\u043e\u043c\u0443 \u0438 \u0442\u043e\u043c\u0443 \u0436\u0435 getters-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e \u0438\u0437 \u0440\u0430\u0437\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0442\u043e \u0432\u044b \u043d\u0435 \u043f\u043e\u0442\u0435\u0440\u044f\u0435\u0442\u0435 \u0432 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438. \u0411\u043e\u043d\u0443\u0441\u043e\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0439 \u043a\u043e\u0434, \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u0433\u0440\u043e\u043c\u043e\u0437\u0434\u043a\u0438\u0445 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0439 \u043f\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 props \u0438 \u0435\u0434\u0438\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u0437 getters \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/p>\n<p><a class=\"anchor\" name=\"4.4\" id=\"4.4\"><\/a><\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043a\u0430\u043a\u043e\u0435-\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f EventBus \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439, \u043d\u043e \u0432 Vue 3 \u043e\u0442 \u043d\u0435\u0433\u043e \u043e\u0442\u043a\u0430\u0437\u0430\u043b\u0438\u0441\u044c, \u0438\u0437-\u0437\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441\u0445\u043e\u0436\u0435\u0439 \u0441 \u043c\u0438\u043a\u0441\u0438\u043d\u0430\u043c\u0438 \u2013 \u0432\u043e\u043b\u0448\u0435\u0431\u043d\u044b\u0439 \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043b\u043e\u0436\u043d\u043e \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u043d\u0430 \u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445. \u0415\u043c\u0443 \u043d\u0430 \u0437\u0430\u043c\u0435\u043d\u0443 \u043f\u0440\u0438\u0448\u043b\u0430 \u043d\u0435 \u043c\u0435\u043d\u0435\u0435 \u0432\u043e\u043b\u0448\u0435\u0431\u043d\u0430\u044f, \u043d\u043e \u0431\u043e\u043b\u0435\u0435 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u043c\u0430\u044f \u0441\u0432\u044f\u0437\u043a\u0430 <a href=\"https:\/\/v3.ru.vuejs.org\/ru\/guide\/component-provide-inject.html\"><u>Provide \/ Inject.<\/u><\/a> \u041e\u043d\u0430 \u0435\u0441\u0442\u044c \u0438 \u0432\u043e Vue 2 c \u0432\u0435\u0440\u0441\u0438\u0438 2.2, \u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0435 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043d\u0435 \u043e\u0431\u0440\u0435\u043b \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u043e\u0441\u0442\u0438, \u0432\u043f\u043b\u043e\u0442\u044c \u0434\u043e Vue 3, \u0433\u0434\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u043c\u0438. \u041d\u043e \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c provide \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 computed \u0438 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043a\u0430\u043a\u0443\u044e-\u0442\u043e \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c.<\/p>\n<h3>\u041a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props, \u0430 \u043a\u043e\u0433\u0434\u0430 Vuex getters?<\/h3>\n<p>Props \u0445\u043e\u0440\u043e\u0448\u043e \u0441\u0435\u0431\u044f \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0432 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u043d\u0430 \u043a\u043e\u0440\u043e\u0442\u043a\u043e\u0439 \u0434\u0438\u0441\u0442\u0430\u043d\u0446\u0438\u0438, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0443\u044e \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u044c. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u0434\u0430\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0433\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (required), \u0438\u043b\u0438 \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0447\u0430\u0441\u0442\u043e \u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u044f\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442.\u00a0<\/p>\n<p>Getters \u0445\u043e\u0440\u043e\u0448\u0438, \u043a\u043e\u0433\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u0438\u0437 \u0446\u0435\u043d\u0442\u0440\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430. Getters \u0441\u0445\u043e\u0436\u0438 \u0441 computed \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 \u0442\u0435\u043c, \u0447\u0442\u043e \u043e\u043d\u0438 \u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0442\u0441\u044f, \u0442\u043e \u0435\u0441\u0442\u044c \u0443 \u043c\u043d\u043e\u0433\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u044f\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0437\u0430\u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e.<\/p>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 Vue 2 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 props \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0432 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0435, getters \u0436\u0435 \u2013 \u0434\u043b\u044f \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0439, \u043a\u043e\u0433\u0434\u0430 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u0434\u043b\u0438\u043d\u043d\u0443\u044e \u0434\u0438\u0441\u0442\u0430\u043d\u0446\u0438\u044e (\u043f\u043e\u043c\u043d\u0438\u043c, \u0447\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 props \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u0442 \u0437\u0430 \u0441\u043e\u0431\u043e\u0439 \u0440\u0435\u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433 \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u0432\u0441\u0435\u0445 \u0437\u0430\u0442\u0440\u043e\u043d\u0443\u0442\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432), \u0438\u043b\u0438 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043e\u0431\u0449\u0438\u043c \u0434\u0430\u043d\u043d\u044b\u043c \u0438\u0437 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u044f\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.\u00a0<\/p>\n<h4>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 eslint \u0434\u043b\u044f props<\/h4>\n<p>\u0412\u044b\u044f\u0432\u043b\u044f\u0442\u044c \u0438 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0442\u0430\u043a\u043e\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u043a\u0430\u043a \u043b\u0438\u043d\u0442\u0435\u0440. \u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0440\u044f\u0434 \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u043f\u0440\u0430\u0432\u0438\u043b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 props. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u043e\u043f\u0438\u0441\u0430\u043b \u043c\u043d\u043e\u0433\u0438\u0435 \u043d\u0435\u0436\u0435\u043b\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f props \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u043b \u043e \u043f\u0440\u0430\u0432\u0438\u043b\u0430\u0445 \u0438 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0435 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u0432 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043d\u0438\u043c\u0438. \u042d\u0442\u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u043c\u043e\u0436\u043d\u043e \u0441\u043c\u0435\u043b\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435.<\/p>\n<p>1) <a href=\"https:\/\/eslint.vuejs.org\/rules\/require-default-prop.html\"><u>vue\/require-default-prop<\/u><\/a> \u2013 \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u044f \u043b\u0438\u0431\u043e default, \u043b\u0438\u0431\u043e required \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f. Boolean \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u044e\u0442\u0441\u044f.<\/p>\n<p>2) <a href=\"https:\/\/eslint.vuejs.org\/rules\/require-prop-types.html\"><u>vue\/require-prop-types<\/u><\/a>\u00a0 \u2013 \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0431\u044b\u043b\u0438 \u0443\u043a\u0430\u0437\u0430\u043d\u044b \u0442\u0438\u043f\u044b props. \u0422\u0430\u043a\u0436\u0435 \u043d\u0435 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u043e\u0448\u0438\u0431\u043a\u0443 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0442\u0438\u043f\u0430 \u0447\u0435\u0440\u0435\u0437 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440.<\/p>\n<p>3) <a href=\"https:\/\/eslint.vuejs.org\/rules\/prop-name-casing.html\"><u>vue\/prop-name-casing<\/u><\/a>\u00a0 \u2013 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0435 \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0435 props. \u0412\u0441\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u044b \u0432 camelCase \u2013 \u044d\u0442\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u044b \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445, \u0438 \u043c\u043d\u043e\u0433\u0438\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 (\u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0432\u0441\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u0438 \u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b\u0435) \u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0442.<\/p>\n<p>4) <a href=\"https:\/\/eslint.vuejs.org\/rules\/no-mutating-props.html\"><u>vue\/no-mutating-props<\/u><\/a> \u2013 \u043d\u0435\u043b\u044c\u0437\u044f \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u043c\u0443\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u043e\u043d\u0438 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f.<\/p>\n<p>5) <a href=\"https:\/\/eslint.vuejs.org\/rules\/require-prop-type-constructor.html\"><u>vue\/require-prop-type-constructor<\/u><\/a> \u2013 \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u043a\u043e\u0433\u0434\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0433\u043e \u0442\u0438\u043f\u0430 (\u043a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, Number) \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u00abNumber\u00bb.<\/p>\n<p>\u0418\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u043e\u0439:<\/p>\n<pre><code class=\"javascript\">{   \"extends\": [     \"plugin:vue\/recommended\"   ],   \"rules\": {     \"vue\/require-prop-type-constructor\": \"error\",     \"vue\/no-mutating-props\": \"error\",     \"vue\/prop-name-casing\": [\"error\", \"camelCase\"],     \"vue\/require-default-prop\": \"error\",     \"vue\/require-prop-types\": \"error\"   } }<\/code><\/pre>\n<p><a class=\"anchor\" name=\"5\" id=\"5\"><\/a><\/p>\n<h2>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h2>\n<p>\u0418\u0442\u0430\u043a, \u043c\u044b \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u0438 \u043d\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b\u0438 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 Vue props \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435, \u043a\u0430\u043a \u0438\u0445 \u043b\u0443\u0447\u0448\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043a\u0430\u043a \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e.<\/p>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0443\u0447\u0438\u043c\u0441\u044f \u0447\u0435\u043c\u0443-\u0442\u043e \u043d\u043e\u0432\u043e\u043c\u0443, \u0442\u043e \u0447\u0430\u0441\u0442\u043e \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u0435\u043c\u0441\u044f \u0441 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u043c\u0438 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u044f\u043c\u0438, \u043c\u0435\u0442\u043e\u0434\u043e\u043b\u043e\u0433\u0438\u044f\u043c \u0438 \u0442\u0435\u043e\u0440\u0438\u044f\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0442\u0440\u0443\u0434\u043d\u044b\u043c\u0438 \u0434\u043b\u044f \u0432\u043e\u0441\u043f\u0440\u0438\u044f\u0442\u0438\u044f. \u041e\u0434\u043d\u0430\u043a\u043e, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0432\u0438\u0434\u0438\u043c \u043f\u0440\u043e\u0441\u0442\u044b\u0435 \u0438 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0433\u043e\u0442\u043e\u0432\u043a\u0430, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u043d\u044f\u0442\u044c, \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043d\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0435 \u0438 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c \u0432\u0441\u0435 \u043f\u043e \u043f\u043e\u043b\u043e\u0447\u043a\u0430\u043c. \u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u044f\u0432\u043b\u044f\u0435\u0442\u0435\u0441\u044c \u043b\u0438 \u0432\u044b \u043e\u043f\u044b\u0442\u043d\u044b\u043c Vue-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u0438\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u0438\u0431\u043b\u0438\u0436\u0430\u0435\u0442\u0435\u0441\u044c \u043a \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044e \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props, \u043e\u0441\u0432\u0430\u0438\u0432\u0430\u044f \u043b\u0443\u0447\u0448\u0438\u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438, \u0438 \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044f, \u043a\u0430\u043a \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435 \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438 \u043a\u0430\u043a \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u2013 \u0432\u0441\u0435 \u044d\u0442\u043e \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u0430\u0436\u043d\u0435\u0439\u0448\u0438\u043c \u0431\u0430\u0433\u0430\u0436\u043e\u043c \u0437\u043d\u0430\u043d\u0438\u0439 \u0438 \u043d\u0430\u0432\u044b\u043a\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438\u043d\u0435\u0441\u0435\u0442 \u0432\u0430\u043c \u043f\u043e\u043b\u044c\u0437\u0443 \u0432\u043e \u0432\u0441\u0435\u0445 \u0432\u0430\u0448\u0438\u0445 \u0442\u0435\u043a\u0443\u0449\u0438\u0445 \u0438 \u0431\u0443\u0434\u0443\u0449\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445.<\/p>\n<p>\u042d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u043f\u043e\u0441\u0432\u044f\u0449\u0435\u043d\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e props, \u043d\u043e \u0435\u0441\u043b\u0438 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u0431\u043b\u0438\u0436\u0435 \u043f\u043e\u0437\u043d\u0430\u043a\u043e\u043c\u0438\u0442\u044c\u0441\u044f \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u0443\u0437\u043d\u0430\u0442\u044c \u043e\u0431 \u043e\u0442\u043b\u0438\u0447\u0438\u044f\u0445, \u0442\u043e \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c \u043a \u043f\u0440\u043e\u0447\u0442\u0435\u043d\u0438\u044e <a href=\"https:\/\/habr.com\/ru\/articles\/668072\/\"><u>\u044d\u0442\u043e\u0442 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b<\/u><\/a>. \u0417\u0434\u0435\u0441\u044c \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432\u043d\u0443\u0442\u0440\u0438 Vue 3, \u0430 \u0438\u043c\u0435\u043d\u043d\u043e \u2013 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 props \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438 \u00ab\u043e\u0431\u0449\u0435\u043d\u0438\u044f\u00bb \u043c\u0435\u0436\u0434\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438.<\/p>\n<p><strong>\u0421\u043f\u0430\u0441\u0438\u0431\u043e \u0437\u0430 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435!<\/strong><\/p>\n<p><strong>\u0410\u0432\u0442\u043e\u0440\u0441\u043a\u0438\u0435 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u0434\u043b\u044f frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 \u043c\u044b \u0442\u0430\u043a\u0436\u0435 \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0435\u043c \u0432 \u043d\u0430\u0448\u0438\u0445 \u0441\u043e\u0446\u0441\u0435\u0442\u044f\u0445 \u2013 <\/strong><a href=\"https:\/\/vk.com\/simbirsoft\"><strong><u>\u0412\u041a\u043e\u043d\u0442\u0430\u043a\u0442\u0435<\/u><\/strong><\/a><strong> \u0438 <\/strong><a href=\"https:\/\/t.me\/+pK7Kj9d-JfNjZjA6\"><strong><u>Telegram<\/u><\/strong><\/a><strong>.<\/strong><\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/765024\/\"> https:\/\/habr.com\/ru\/articles\/765024\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u0425\u0430\u0431\u0440! \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c\u0441\u044f, \u043a\u0430\u043a frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0443 \u0433\u043e\u0442\u043e\u0432\u0438\u0442\u044c \u043d\u0430 \u00ab\u043a\u0443\u0445\u043d\u0435\u00bb props. \u0412\u044b\u0431\u0438\u0440\u0430\u0439\u0442\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0438\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: \u0434\u0436\u0443\u043d\u044b-\u043f\u043e\u0432\u0430\u0440\u044f\u0442\u0430 \u0441\u043c\u043e\u0433\u0443\u0442 \u043b\u0443\u0447\u0448\u0435 <a href=\"#1\"><u>\u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0438 props \u043d\u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 Vue.js<\/u><\/a>, \u0430 \u0435\u0449\u0435 \u043c\u044b \u0437\u0430\u0442\u0440\u043e\u043d\u0435\u043c \u0442\u0435\u043c\u0443 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u0414\u043b\u044f \u043c\u0438\u0434\u043b\u043e\u0432 \u0438 \u0431\u043e\u043b\u0435\u0435 \u043e\u043f\u044b\u0442\u043d\u044b\u0445 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0441\u0442\u043e\u0432 \u2014 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0445 \u0448\u0435\u0444-\u043f\u043e\u0432\u0430\u0440\u043e\u0432 \u043c\u044b \u043f\u0440\u0438\u0433\u043e\u0442\u043e\u0432\u0438\u043b\u0438 <a href=\"#4\"><u>\u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 props<\/u><\/a>, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u043e\u0441\u0432\u0435\u0436\u0438\u0442\u044c \u0432 \u043f\u0430\u043c\u044f\u0442\u0438 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u0438\u043b\u0438 \u0440\u0435\u0448\u0438\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443, \u0435\u0441\u043b\u0438 \u0437\u0430\u043c\u044b\u043b\u0438\u043b\u0441\u044f \u0433\u043b\u0430\u0437.\u00a0<\/p>\n<p><a href=\"https:\/\/www.freecodecamp.org\/news\/how-to-use-props-in-vuejs\/\"><strong><u>Props<\/u><\/strong><\/a><strong> <\/strong>\u2013 \u043e\u0442 \u0441\u043b\u043e\u0432\u0430 \u00abproperties\u00bb (\u0437\u0434\u0435\u0441\u044c \u0438 \u0434\u0430\u043b\u044c\u0448\u0435 \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0432\u043e \u00abprops\u00bb) \u2013 \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0432 \u044d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0435 Vue \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. \u041e\u043d\u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c \u0442\u0438\u043f\u044b \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c \u0441 \u043d\u0438\u043c\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e.<\/p>\n<p>\u041f\u043e \u0431\u043e\u043b\u044c\u0448\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043f\u043e\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 props. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u0442\u0430\u0442\u044c\u044f \u0431\u0443\u0434\u0435\u0442 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u0430 \u043a\u0430\u043a \u0434\u043b\u044f Vue 2, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f Vue 3, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043f\u043e \u0447\u0430\u0441\u0442\u0438 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f props \u043e\u0442\u043b\u0438\u0447\u0438\u0439 \u043c\u0430\u043b\u043e. \u041d\u043e \u0442\u0430\u043a \u043a\u0430\u043a \u0432 Composition API \u0438 TypeScript \u0432\u0441\u0435 \u0436\u0435 \u043e\u043d\u0438 \u0435\u0441\u0442\u044c, \u0442\u043e \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0438\u0445 \u0442\u043e\u0436\u0435.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0433\u043e\u0442\u043e\u0432\u044b, \u0442\u043e \u0434\u043e\u0431\u0440\u043e \u043f\u043e\u0436\u0430\u043b\u043e\u0432\u0430\u0442\u044c, \u043c\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u043c \u043d\u0430\u0448 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u0433\u0430\u0439\u0434! <em>Bon app\u00e9tit!<\/em><\/p>\n<figure class=\"full-width\"><\/figure>\n<h2>\u041e\u0433\u043b\u0430\u0432\u043b\u0435\u043d\u0438\u0435<\/h2>\n<ol>\n<li>\n<p><a href=\"#1\"><strong>\u0420\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c\u0441\u044f \u0441 Props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 1\/5)<\/p>\n<\/li>\n<li>\n<p><a href=\"#2\"><strong>\u0427\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 props \u0438 \u043d\u0435 \u0438\u0441\u043f\u043e\u0440\u0442\u0438\u0442\u044c \u0432\u0441\u0451<\/strong><\/a><\/p>\n<p>\u2022 <a href=\"#2.1\">\u041a\u0430\u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#3\"><strong>\u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 3\/5)<\/p>\n<p>\u2022 <a href=\"#3.1\">\u041e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445 \u0442\u0438\u043f\u0430\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/a><\/p>\n<p>\u2022 <a href=\"#3.2\">Default \u2013 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e<\/a><\/p>\n<p>\u2022 <a href=\"#3.3\">Required \u2013 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f<\/a><\/p>\n<p>\u2022 <a href=\"#3.4\">Validator \u2013 \u0441\u0432\u043e\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f<\/a><\/p>\n<p>\u2022 <a href=\"#3.5\">\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u044e props \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u0445 \u0438\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430\u0445<\/a><\/p>\n<p>\u2022 <a href=\"#3.6\">\u041f\u0440\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 props<\/a><\/p>\n<p>\u2022 <a href=\"#3.7\">\u0415\u0441\u0442\u044c \u043b\u0438 \u0441\u043c\u044b\u0441\u043b \u0432 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 default \u0438 required?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#4\"><strong>\u041f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u043a\u0443\u043b\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 props<\/strong><\/a><strong> <\/strong>(\u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 4\/5)<\/p>\n<p>\u2022 <a href=\"#4.1\">\u0425\u0443\u043a\u0438 \u0432\u043e Vue<\/a><\/p>\n<p>\u2022 <a href=\"#4.2\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f \u043e\u0434\u043d\u043e\u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (One way data flow)?<\/a><\/p>\n<p>\u2022 <a href=\"#4.3\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 props drilling?\u00a0<\/a><\/p>\n<p>\u2022 <a href=\"#4.4\">\u041a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props, \u0430 \u043a\u043e\u0433\u0434\u0430 Vuex getters?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#5\"><strong>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/strong><\/a><\/p>\n<\/li>\n<\/ol>\n<p><a class=\"anchor\" name=\"1\" id=\"1\"><\/a><\/p>\n<h2>\u0420\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c\u0441\u044f \u0441 props<\/h2>\n<p><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438: 1\/5<\/strong><\/p>\n<p>\u0412\u044b\u0448\u0435 \u043c\u044b \u0443\u0436\u0435 \u0434\u0430\u043b\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435, \u0430 \u0442\u0435\u043f\u0435\u0440\u044c \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c\u0441\u044f \u0441 props \u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435.<\/p>\n<p>\u0414\u043e\u043f\u0443\u0441\u0442\u0438\u043c, \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u0441\u0430\u0439\u0442 \u043f\u0438\u0446\u0446\u0435\u0440\u0438\u0438, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043c\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u2026 \u043f\u0438\u0446\u0446\u0443.\u00a0<\/p>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;h2>Pizza 1&lt;\/h2>     &lt;ul>       &lt;li>Crust: Thin&lt;\/li>       &lt;li>Sauce: Marinara&lt;\/li>       &lt;li>Cheese: Mozzarella&lt;\/li>       &lt;li>Toppings: Pepperoni, Mushrooms, Green Peppers&lt;\/li>     &lt;\/ul>     &lt;h2>Pizza 2&lt;\/h2>     &lt;ul>       &lt;li>Crust: Thick&lt;\/li>       &lt;li>Sauce: BBQ&lt;\/li>       &lt;li>Toppings: Chicken, Bacon, Onions&lt;\/li>     &lt;\/ul>   &lt;\/div> &lt;\/template><\/code><\/pre>\n<p>\u041a\u043e\u0434 \u0432\u044b\u0448\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435 \u043b\u0443\u0447\u0448\u0438\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043e\u043d \u043d\u0435 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0437\u0430\u0445\u0430\u0440\u0434\u043a\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438 \u0441\u043b\u043e\u0436\u043d\u043e \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u041e\u0434\u043d\u0430\u043a\u043e \u0432\u043e Vue \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0443\u044e\u0441\u044f \u043b\u043e\u0433\u0438\u043a\u0443 \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0435\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 props. \u041a\u0430\u043a \u043c\u044b \u0443\u0436\u0435 \u0433\u043e\u0432\u043e\u0440\u0438\u043b\u0438 \u0432\u044b\u0448\u0435, props \u2014 \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 Vue. \u0410 \u043e\u043d\u0430, \u0432 \u0441\u0432\u043e\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0438 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b. Props \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u0432\u043c\u0435\u0441\u0442\u0435 \u043a\u0430\u043a \u043b\u0443\u0447\u0448\u0438\u0435 \u0434\u0440\u0443\u0437\u044c\u044f, \u043a\u0430\u043a \u0436\u0435\u043b\u0442\u044b\u0439 \u0438 \u043a\u0440\u0430\u0441\u043d\u044b\u0439 \u0438\u0437 \u044d\u043c\u0435\u043c\u0434\u0435\u043c\u0441, \u043a\u0430\u043a \u043f\u0435\u043b\u044c\u043c\u0435\u043d\u0438 \u0438 \u0441\u043c\u0435\u0442\u0430\u043d\u0430, \u043a\u0430\u043a \u043f\u0438\u0446\u0446\u0430 \u0438 \u0430\u043d\u0430\u043d\u0430\u0441\u044b, \u043a\u0430\u043a \u043a\u043e\u0442\u043b\u0435\u0442\u043a\u0438 \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439 \u2013 \u0438\u0434\u0443\u0442 \u0432\u043c\u0435\u0441\u0442\u0435 \u0438 \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u044f\u044e\u0442 \u0434\u0440\u0443\u0433 \u0434\u0440\u0443\u0433\u0430! =)  <\/p>\n<figure class=\"full-width\">\n<div><figcaption>\u0412\u043a\u0443\u0441 \u043a\u043e\u0442\u043b\u0435\u0442\u043e\u043a \u0441 \u043f\u044e\u0440\u0435\u0448\u043a\u043e\u0439. \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;h2>{{ title }}&lt;\/h2>     &lt;ul>       &lt;li>Crust: {{ crust }}&lt;\/li>       &lt;li v-if=\"sauce\">Sauce: {{ sauce }}&lt;\/li>       &lt;li v-if=\"cheese\">Cheese: {{ cheese }}&lt;\/li>       &lt;li>Toppings:&lt;\/li>       &lt;ul>         &lt;li v-for=\"topping in toppings\" :key=\"topping\">{{ topping }}&lt;\/li>       &lt;\/ul>     &lt;\/ul>   &lt;\/div> &lt;\/template>  &lt;script> export default {   props: {     title: {       type: String,       required: true     },     isThick: {       type: Boolean,       default: true     },     sauce: {       type: String,       default: null     },     cheese: {       type: String,       default: \u201c     },     toppings: {       type: Array,       required: true     }   } } &lt;\/script><\/code><\/pre>\n<p>\u041c\u044b \u0441\u043e\u0437\u0434\u0430\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Pizza, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 5 props: <code>\u201ctitle\u201d, \u201ccrust\u201d, \u201csauce\u201d, \u201ccheese\u201d, \u201ctoppings\u201d.<\/code> \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u0435\u043c \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u043d\u0443\u0436\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0432 \u043d\u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043d\u0443\u0436\u043d\u044b\u0445 \u043d\u0430\u043c props. \u0412 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props \u0432\u043d\u0443\u0442\u0440\u0438 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 <code>&lt;template><\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 <code>{{ }}<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c <code>props<\/code> \u0441 \u0438\u043c\u0435\u043d\u0435\u043c \u201ccrust\u201d, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043a\u0430\u043a <code>{{ crust }}<\/code>.<\/p>\n<p>\u0422\u043e \u0435\u0441\u0442\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c props \u0442\u0430\u043a \u0436\u0435, \u043a\u0430\u043a \u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435, \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0435 \u0432 data, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u041d\u043e \u0432\u0430\u0436\u043d\u043e \u0438\u043c\u0435\u0442\u044c \u0432 \u0432\u0438\u0434\u0443, \u0447\u0442\u043e props \u0434\u043e\u043b\u0436\u043d\u044b \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0434\u0430\u043d\u043d\u044b\u0435, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f, \u0438 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435.\u00a0<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043d\u0430\u043c \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u044d\u0442\u0438\u0445 props, \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0441\u0442\u0438\u043b\u0438, \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0435 props, \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u2013 \u043c\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043d\u0435\u0441\u0435\u043c \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Pizza! Chefs kiss ?!<\/p>\n<pre><code class=\"javascript\">&lt;template>   &lt;div>     &lt;Pizza title=\"Pizza 1\" :is-thick=\u201dfalse\u201d sauce=\"Marinara\" cheese=\"Mozzarella\" :toppings=\"['Pepperoni', 'Mushrooms', 'Green Peppers']\" \/>     &lt;Pizza :title=\"'Pizza 2'\" is-thick :sauce=\"'BBQ'\" :toppings=\"['Chicken', 'Bacon', 'Onions']\" \/>     &lt;Pizza title=\"Pizza 3\" crust=\"Thin\" :toppings=\"['Pepperoni']\" \/>   &lt;\/div> &lt;\/template>  &lt;script> import Pizza from '@\/components\/Pizza.vue'  export default {   components: {     Pizza   } } &lt;\/script><\/code><\/pre>\n<p>\u041a\u0442\u043e \u043c\u043e\u043b\u043e\u0434\u0435\u0446 \u0438 \u0437\u0430\u043c\u0435\u0442\u0438\u043b \u0432\u0441\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u044f? \u0420\u0430\u0434\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 props \u043f\u043e-\u0440\u0430\u0437\u043d\u043e\u043c\u0443, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u044f.\u00a0<\/p>\n<p>\u0417\u0430\u043e\u0441\u0442\u0440\u0438\u043c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 <code>title=\"Pizza 1\"<\/code> \u0438 <code>:title=\"'Pizza 2'\"<\/code>. \u0412 \u043f\u0435\u0440\u0432\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c String \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>\u201cPizza 1\u201d<\/code> \u043a\u0430\u043a \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u043c \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>\u201cPizza 2\u201d<\/code> \u043a\u0430\u043a \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 (\u0440\u0435\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0435) \u0447\u0435\u0440\u0435\u0437 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0443 <code>v-bind:<\/code> (\u0438\u043b\u0438 \u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u043d\u043e <code>:<\/code> ).\u00a0<\/p>\n<p>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0441\u0435\u0433\u0434\u0430 \u0432\u044b \u0437\u0430\u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u0441\u044b\u043b\u0430\u0442\u044c props \u0438\u043c\u0435\u043d\u043d\u043e \u0447\u0435\u0440\u0435\u0437 \u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u043d\u044b\u0439 <code>\u201cv-bind:\u201d<\/code> (\u043a\u0430\u043a \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435) \u2013 \u0442\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0435\u0431\u044f \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u043e\u0442 \u0432\u043d\u0435\u0437\u0430\u043f\u043d\u044b\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0438 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u0441\u044f, \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043e String- \u0438 Boolean-\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438. \u0418\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u043d\u044e\u0430\u043d\u0441 \u0441 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435\u0439 Boolean:<\/p>\n<pre><code class=\"javascript\">&lt;PizzaItem is-hawaiian \/>  &lt;PizzaItem :is-hawaiian=\"true\" \/><\/code><\/pre>\n<p><a class=\"anchor\" name=\"2\" id=\"2\"><\/a><\/p>\n<p>\u0412 \u043e\u0431\u043e\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435<code>\u00a0\u201ctrue\u201d <\/code>\u2013 \u0438 \u0442\u0430\u043a\u043e\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0447\u0430\u0441\u0442\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u044f\u0441\u043d\u044b\u043c \u0438 \u043a\u0440\u0430\u0442\u043a\u0438\u043c.<\/p>\n<h2>\u0427\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 props \u0438 \u043d\u0435 \u0438\u0441\u043f\u043e\u0440\u0442\u0438\u0442\u044c \u0432\u0441\u0451<\/h2>\n<blockquote>\n<p><em>\u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u043f\u0438\u0446\u0446\u0443, \u0432 \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u043a\u043e\u0439 \u0443\u0433\u043e\u0434\u043d\u043e \u0438\u043d\u0433\u0440\u0435\u0434\u0438\u0435\u043d\u0442 \u0438 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043d\u0430 \u0432\u044b\u0445\u043e\u0434\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442! \u0412 \u043e\u0434\u043d\u0443 \u043f\u0438\u0446\u0446\u0443 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0441\u043e\u0443\u0441\u0430 \u043c\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0442\u043e\u043c\u0430\u0442\u043d\u0443\u044e \u043f\u0430\u0441\u0442\u0443, \u0432 \u0434\u0440\u0443\u0433\u0443\u044e \u2013 \u0441\u043e\u0443\u0441, \u0430 \u0432 \u0442\u0440\u0435\u0442\u044c\u0435\u0439 \u043e\u0431\u043e\u0439\u0434\u0435\u043c\u0441\u044f \u0431\u0435\u0437 \u043d\u0435\u0433\u043e.\u00a0<\/em><\/p>\n<\/blockquote>\n<p>Props \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043d\u0430\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0432 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439. \u0418\u0445\u00a0 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043b\u044e\u0431\u043e\u0433\u043e \u0442\u0438\u043f\u0430, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0438, \u0447\u0438\u0441\u043b\u0430, \u043e\u0431\u044a\u0435\u043a\u0442\u044b, \u043c\u0430\u0441\u0441\u0438\u0432\u044b \u0438 \u0434\u0430\u0436\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u041e\u043d\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438 \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445. Props \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u044e\u0442 \u043d\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435, \u043c\u0435\u043d\u044f\u044f\u0441\u044c, \u0438 \u043c\u0435\u043d\u044f\u044f \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435. \u041f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 props, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043c\u043e\u0434\u0443\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u043b\u0435\u0433\u043a\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c\/\u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c (\u0447\u0442\u043e, \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0443 DRY \u2013 Don&#8217;t Repeat Yourself!)\u00a0 \u0438 \u0430\u0434\u0430\u043f\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0434\u0435\u043b\u0430\u044f \u043d\u0430\u0448 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u0433\u0438\u0431\u043a\u0438\u043c, \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u044b\u043c \u0438\u2026 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u043c.<\/p>\n<p><a class=\"anchor\" name=\"2.1\" id=\"2.1\"><\/a><\/p>\n<h3>\u041a\u0430\u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u0432 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442?<\/h3>\n<p>\u041a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435, \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c props \u043f\u0440\u043e\u0441\u0442\u043e \u0438 \u0442\u0430\u043a&#8230;\u00a0<\/p>\n<pre><code class=\"javascript\">props: {     name: String,     description: String,     price: Number }<\/code><\/pre>\n<p>&#8230;\u0438\u043b\u0438 \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c&#8230;<\/p>\n<pre><code class=\"javascript\">props: ['pizzaName', 'slicesCount']<\/code><\/pre>\n<p>&#8230;\u0447\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043d\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442 \u044d\u0442\u0443 \u00ab\u043f\u0438\u0446\u0446\u0443\u00bb:<\/p>\n<figure class=\"full-width\"><\/figure>\n<p><strong>\u041f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a \u043b\u0443\u0447\u0448\u0435 \u043d\u0435 \u0434\u0435\u043b\u0430\u0442\u044c?<\/strong><\/p>\n<ol>\n<li>\n<p>\u0412\u0430\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0442\u0438\u043f\u044b \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0437 props, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043b\u0435\u0433\u043a\u043e \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u0438 \u0431\u044b\u0441\u0442\u0440\u043e \u0438\u0445 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c.\u00a0<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438 \u0443\u0432\u0435\u043b\u0438\u0447\u0435\u043d\u0438\u0438 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u0430 props, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u043e\u0436\u043d\u0435\u0435 \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u043a\u0430\u043a\u0438\u0435 \u0438\u0437 \u043d\u0438\u0445 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b, \u0430 \u043a\u0430\u043a\u0438\u0435 \u043d\u0435\u0442, \u0438 \u043a\u0430\u043a\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043e\u043d\u0438 \u043c\u043e\u0433\u0443\u0442 \u0438\u043c\u0435\u0442\u044c. \u0427\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u044f\u0432\u043d\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e props. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u043b\u0435\u0433\u043a\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043f\u043e \u043c\u0435\u0440\u0435 \u0435\u0433\u043e \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u0445\u043e\u0440\u043e\u0448\u0435\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f props \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u0445 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0435\u0433\u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438. \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0441\u0435\u0433\u0434\u0430 \u0432 camelCase (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, pizzaName) \u2013 \u044d\u0442\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445, \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0439 \u0432 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u043c\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 4 \u0442\u0438\u043f\u0430 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0439. \u041a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043d\u0438\u0445 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0434\u0430\u043b\u0435\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<p>1) <strong>type<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0442\u0438\u043f\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0442\u043e \u0435\u0441\u0442\u044c, String, Number, Boolean, Object, Array, Date, Function. \u0415\u0449\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b, \u043d\u043e \u043f\u043e\u043a\u0430, \u0434\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430, \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0438\u043c\u0441\u044f \u043d\u0430 \u044d\u0442\u043e\u043c.<\/p>\n<p>2) <strong>default<\/strong> \u2013 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0435\u0441\u043b\u0438 \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u043e\u0441\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u043b\u0438 \u0438\u043c\u0435\u0435\u0442 undefined \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>3) <strong>required<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 undefined. \u0412\u044b\u0434\u0430\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u0431\u044b\u043b\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043e.<\/p>\n<p>4) <strong>validator<\/strong> \u2013 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f. \u0422\u043e\u0436\u0435 \u0432\u044b\u0434\u0430\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0443, \u0435\u0441\u043b\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0435 \u043f\u0440\u043e\u0439\u0434\u0435\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443.<\/p>\n<p>\u041e\u0431\u044b\u0447\u043d\u043e \u043d\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0432\u0441\u0435 4 \u0432\u0430\u043b\u0438\u0434\u0430\u0442\u043e\u0440\u0430 \u0441\u0440\u0430\u0437\u0443, \u043d\u043e \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c, \u0447\u0442\u043e \u0445\u043e\u0440\u043e\u0448\u0435\u0439 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435 \u0442\u0438\u043f\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e props, \u0430 default\/required (\u0445\u043e\u0442\u044f \u0431\u044b \u0447\u0442\u043e-\u0442\u043e \u043e\u0434\u043d\u043e \u0438\u0437 \u044d\u0442\u043e\u0433\u043e \u043a\u0440\u0430\u0439\u043d\u0435 \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e).<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u0438\u0437 props. \u041f\u043e\u043a\u0430 \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u0435\u0433\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u044b\u043c, \u043d\u043e \u043f\u043e \u043c\u0435\u0440\u0435 \u043f\u0440\u043e\u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f \u043f\u043e \u0441\u0442\u0430\u0442\u044c\u0435 \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0441\u0442\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u043c\u0438 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f\u043c\u0438 \u0438 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f\u043c\u0438. \u041c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u043f\u043e\u0439\u043b\u0435\u0440\u0438\u0442\u044c \u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043d\u0430 \u0433\u043e\u0442\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043a\u043e\u043d\u0446\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u043e \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0438\u043b\u0438 \u0447\u0435\u0440\u0435\u0437 \u043f\u043e\u0438\u0441\u043a \u043f\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u00ab\u0444\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u0434\u00bb.<\/p>\n<pre><code class=\"javascript\">props: {     \/\/ String     pizzaName: {       type: String,     },      \/\/ Number      slicesCount: {       type: Number,     },      \/\/ Boolean     isHawaiian : {       type: Boolean,     },      \/\/ Array     toppings: {       type: Array,     },      \/\/ Object     pizzaItem: {       type: Object,     },      \/\/ \u0414\u0430\u0442\u044b delieveryDate: {   type: Date,  },   \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 props \u0441 \u043b\u044e\u0431\u044b\u043c \u0442\u0438\u043f\u043e\u043c, \u043b\u0438\u0448\u044c \u0431\u044b \u043d\u0435 undefined    definedProp: {      required: true,    }, };<\/code><\/pre>\n<p>\u0418 \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u043f\u0438\u0446\u0446\u044b \u0443 \u043d\u0430\u0441 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0432\u043e\u0442 \u0442\u0430\u043a\u043e\u0439:<\/p>\n<figure class=\"\">\n<div><figcaption>\u0423\u0436\u0435 \u043b\u0443\u0447\u0448\u0435 ?  \u0421\u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u043d\u0435\u0439\u0440\u043e\u0441\u0435\u0442\u044c\u044e Kandinsky 2.2<\/figcaption><\/div>\n<\/figure>\n<h4>Vue 3, Composition API, TypeScript \u0438 props<\/h4>\n<p>\u0412\u043e Vue 3 \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f Composition API, \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u0439\u0441\u044f \u043e\u0442 \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u043e\u0433\u043e \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u0430 Vue 2 (\u0442\u0435\u043f\u0435\u0440\u044c \u2013<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-356509","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/356509","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=356509"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/356509\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=356509"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=356509"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=356509"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}