Как динамически создавать и прикреплять элемент к DOM, когда пользователь нажимает кнопку в VueJS - PullRequest
Новая
       16

Как динамически создавать и прикреплять элемент к DOM, когда пользователь нажимает кнопку в VueJS

0 голосов
/ 25 апреля 2019

Я пытаюсь создать виртуальное веб-приложение, в котором фигура (например, квадрат) прикрепляется к веб-странице в том месте, где пользователь нажимает.Но я не могу понять, как создать форму и прикрепить ее.Это мой код, но он ничего не делает. 

<template>
    <div class="shapepage" @click="attachShape"></div>
</template>

<script>
export default {
    name: "ShapePage",
    methods: {
        attachShape: (e) => {
            render:  (createElement) => {
                return createElement('div', {
                    style: {
                        width: "100px",
                        height: "100px",
                        background: "red",
                        color: "white",
                        position: "absolute",
                        left: "50",
                        top: "50"
                    }
                });
            }
        }
    }
}
</script>

<style>
body {
    background-color: rgba(245, 245, 245, 1);
}

.shapepage {
    margin-top: 20px;
    max-width: 500px;
    height: 500px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    box-shadow: 0px 0px 5px 1px grey;
}
</style>

1 Ответ

0 голосов
/ 25 апреля 2019

По моему мнению, визуализация как функция, которая выглядит как data (), поэтому я думаю, что вы не можете использовать таким образом,
Если мое мнение верно, функция рендеринга может быть такой же, как рендеринг в React.js, она будет возвращать VNode Tree, а в vue по умолчанию (использовать шаблон ожидаемого рендеринга) она будет выполняться по шаблону и запускаться, когда VNode должен быть обновлен.
Я надеюсь, что могу помочь вам

...