@100R

Первые шаги в Vue.js?

На основе стандартного примера пробую реализовать корзину покупок. В некоторых местах сразу же возникло не понимание.

app.blade.php

<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <meta name="csrf-token" content="{{ csrf_token() }}">
        <title>Document</title>
        <link rel="stylesheet" href="{{ asset('css/app.css') }}">
    </head>
    <body>
        <div id="app"></div>
        <script src="{{ asset('js/app.js') }}"></script>
    </body>
</html>


Что за магическая конструкция render: h => h(App)? Правильно ли я понимаю, что если мы записываем в таком виде, то нам не нужно указывать компонент в app.blade.php? На следующем этапе я планируется подключить Vne Router. Не сыграет ли такой подход мне во вред?

app.js

import Vue from 'vue'
import App from './components/App.vue'

new Vue({
    el: '#app',
    render: h => h(App)
})


Опять не понятно. Если указать <ProductList><ProductList/>, то будет ошибка, а вот так <ProductList/> - работает. Если не трудно, то помогите пожалуйста разобраться. Одно дело сделать так чтобы это работало, другое понимать как это работает. Спасибо.

App.vue

<template>
    <div id="app">
        <ProductList/>
        <ShoppingCart/>
    </div>
</template>

<script>
    import ProductList from './ProductList.vue'
    import ShoppingCart from './ShoppingCart.vue'

    export default {
        components: {
            ProductList,
            ShoppingCart
        }
    }
</script>
  • Вопрос задан
  • 599 просмотров
Решения вопроса 1
notiv-nt
@notiv-nt
первый агрумент в render это функция createElement, обычно сокращают до h

<само-закрывающийся-тег />
<открывающий></закрыващюий>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы