我正在尝试使用 electron-vue 种子应用程序并将电子升级到 8 并将 vue 升级到最新版本。我在我的 src/renderer/router/index.js 中安装 vue-material 组件:
import Vue from 'vue'
import Router from 'vue-router'
import { MdButton, MdContent, MdTabs, MdAutocomplete } from 'vue-material/dist/components'
import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default-dark.css'
Vue.use(Router)
Vue.use(MdButton)
Vue.use(MdContent)
Vue.use(MdTabs)
Vue.use(MdAutocomplete)
然后我src/renderer/App.vue
有
<template>
<div id="app">
<router-view></router-view>
</div>
</template>
<script>
export default {
name: 'pdq-app'
}
</script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;600&display=swap|Roboto:400,500,700,400italic|Material+Icons');
html {
font-family: 'Source Code Pro', monospace;
}
</style>
我正在使用 CommandLine.vue 组件在 CommandLine.vue 模板上绘制自动完成功能:
<template>
<main>
<main-menu></main-menu>
<command></command>
</main>
</template>
<script>
import MainMenu from './MainMenu'
import Command from './CommandLine/Command'
export default {
name: 'command-line',
components: { MainMenu, Command },
methods: {
open (link) {
this.$electron.shell.openExternal(link)
}
}
}
</script>
<style>
</style>
因此,自动完成组件是:
<template>
<div>
<md-autocomplete v-model="selectedCountry" :md-options="countries">
<label>Country</label>
</md-autocomplete>
<md-autocomplete v-model="selectedEmployee" :md-options="employees" md-dense>
<label>Employees</label>
</md-autocomplete>
</div>
</template>
<script>
export default {
name: 'AutocompleteStatic',
data: () => ({
selectedCountry: null,
selectedEmployee: null,
countries: [
'Algeria',
'Argentina',
'Brazil',
'Canada',
'Italy',
'Japan',
'United Kingdom',
'United States'
],
employees: [
'Jim Halpert',
'Dwight Schrute',
'Michael Scott',
'Pam Beesly',
'Angela Martin',
'Kelly Kapoor',
'Ryan Howard',
'Kevin Malone',
'Creed Bratton',
'Oscar Nunez',
'Toby Flenderson',
'Stanley Hudson',
'Meredith Palmer',
'Phyllis Lapin-Vance'
]
})
}
</script>
问题是我不确定我缺少什么来显示输入控件 - 它呈现不可见。呈现的 HTML 中存在一个md-input
标签,但似乎我缺少一些绘制内容的依赖项:
我缺少什么来绘制完整的自动完成功能?