Я пытаюсь научиться электронному, понимая готовый код. В качестве источника я использую Eplee, читатель epub, созданный с помощью vue js electronic. Вот ссылка на источник для Eplee. https://github.com/Janglee123/eplee

{amp}lt;!-- BookmarkMenu.vue --{amp}gt; {amp}lt;template{amp}gt; {amp}lt;el-popover :popper-class="`popper ${theme}`" width="350" trigger="hover"{amp}gt; {amp}lt;div class="el-popover__title"{amp}gt; Bookmarks {amp}lt;el-button size="mini" icon="el-icon-plus" circle @click="addBookmark" /{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;el-button slot="reference" size="small" icon="el-icon-collection-tag" circle /{amp}gt; {amp}lt;el-tree :data="bookmarks" node-key="id" @node-click="onNodeClick"{amp}gt; {amp}lt;span slot-scope="{ node }" class="custom-tree-node"{amp}gt; {amp}lt;span{amp}gt;{{ node.label }}{amp}lt;/span{amp}gt; {amp}lt;span{amp}gt; {amp}lt;el-button type="text" icon="el-icon-close" @click="() ={amp}gt; removeBookmark(node)" /{amp}gt; {amp}lt;/span{amp}gt; {amp}lt;/span{amp}gt; {amp}lt;/el-tree{amp}gt; {amp}lt;/el-popover{amp}gt; {amp}lt;/template{amp}gt; {amp}lt;script{amp}gt; export default { name: 'BookmarkMenu', props:{ bookmarks:{ default:()={amp}gt;{}, type: Array, }, theme:{ default:'default', type:String, } }, methods:{ addBookmark(){ this.$emit('add-bookmark'); }, removeBookmark(data){ this.$emit('remove-bookmark',data); }, onNodeClick(data){ this.$emit('node-click',data); } } } {amp}lt;/script{amp}gt; {amp}lt;style lang="scss" scoped{amp}gt; {amp}lt;/style{amp}gt; 

Я не понимаю, как данные связаны здесь.

Например, {amp}lt;el-button size="mini" icon="el-icon-plus" circle @click="addBookmark" /{amp}gt; при нажатии

  1. это вызывает метод addBookmark метода BookmarkMenu.vue

  2. Метод addBookmark вызывает 'add-bookmark' родительского компонента

Но {amp}lt;el-button{amp}gt;{amp}lt;/el-button{amp}gt; — это просто класс, добавленный для стилизации, а не родительский компонент.

И для vue, и для реакции я подумал, что для импорта компонентов из другого файла и их правильного размещения мне нужно разместить две вещи.

  1. линия импорта
  2. линия размещения

Вопрос 1: это правильный способ импорта? или вам нужна только 1. строка импорта?

Вопрос 2: Итак, как в Vue-Electron связывать данные между родительским и дочерним компонентами?

Я предполагаю, что файловый конструктор позаботится об этом https://github.com/SimulatedGREG/electron-vue/blob/master/docs/en/renderer-process.md

Electron — это просто среда выполнения вашего веб-приложения.

Взгляните на модель событий Vue.js.

https://vuejs.org/v2/guide/events.html https://vuejs.org/v2/guide/components-custom-events.html

Также ознакомьтесь с руководством по компонентам https://ru.vuejs.org/v2/guide/components.html.

В твоем случае

{amp}lt;el-button{amp}gt;{amp}lt;/el-button{amp}gt; — это просто класс, добавленный для стилизации, а не родительский компонент.

Это не родительский компонент, это дочерний компонент компонента {amp}lt;BookmarkMenu{amp}gt; . И это может содержать абсолютно все внутри.

И this.$emit('add-bookmark'); Метод запускает прослушиватель событий (если есть) компонента, у которого {amp}lt;BookmarkMenu{amp}gt; является дочерним.

Например, {amp}lt;BookmarkMenu @add-bookmark="someHandlerInAComponentContainingBookmarkMenu"/{amp}gt;