VueJS组件未呈现

JavaScript

逆天ProNear

2020-03-13

我有一个非常基本的vueJS应用程序,正在网站上关注我。

这是代码,为什么组件无法渲染?

的HTML

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <p>{{ message }}</p>
</div>

<div>
<ol>
  <todo-item></todo-item>
</ol>
</div>

JS

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

Vue.component('todo-item', {
    template: '<li>This is a list item</li>'
})

第1540篇《VueJS组件未呈现》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
路易Gil 2020.03.13

我的组件也没有渲染。

如果不是那么明显,就像我所看到的,请看一下如何导入组件。

例如,首先我有:

import { CurrencyConverter } from "./CurrencyConverter.vue";

并且必须去掉括号,所以看起来像这样:

import CurrencyConverter from "./CurrencyConverter.vue";

当然,这意味着在组件中使用以下语法:

export default {
    name: "CurrencyConverter",
}
超威蓝喵 2020.03.13
<template>  
 <div>       
  <DeleteModal :trigger="isDelete" :title="deleteTitle" :body="deleteBody" @request="remove"></DeleteModal>
</div>
</template>
<script>
import DeleteModal from "./../common/DeleteModal";
export default {
components:{
DeleteModal
},
data: () => ({
     )}
}

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android