首页 > 解决方案 > 我的组件没有显示-vuejs-laravel

问题描述

试图在我的刀片中显示组件但它仍然无法正常工作。我使用 laravel 7

有我的vue

<template>
    <h3>Option Values</h3>
</template>
<script>
    export default {
        name: "attribute-values",
        props: ['attributeid'],
    }
</script>

在我看来,我是怎么称呼它的

<div class="tab-pane" id="values">
          <attribute-values :attributeid="{{ $attribute->id }}"></attribute-values>
                </div>

我将它导入到 js 文件中

Vue.component('attribute-values', require('./components/AttributeValues.vue').default);

有我的 package.json 文件

"devDependencies": {
    "axios": "^0.19",
    "bootstrap": "^4.0.0",
    "cross-env": "^7.0",
    "jquery": "^3.2",
    "laravel-mix": "^5.0.1",
    "lodash": "^4.17.19",
    "popper.js": "^1.12",
    "resolve-url-loader": "^2.3.1",
    "sass": "^1.20.1",
    "sass-loader": "^8.0.0",
    "vue": "^2.5.17",
    "vue-template-compiler": "^2.6.10"
},
"dependencies": {
    "vue-swal": "^0.1.0",
    "vue-js-modal": "^1.3.26"
}

我该怎么办。提前谢谢你。我多次运行 npm run dev 和 npm run watch。我的文件 js 是在公用文件夹中生成的,所以没有问题。但组件仍未出现。

标签: laravelvue.js

解决方案


我解决了。我所做的只是将 div id=app 与我的内容分开。因为标签与 vue 不匹配。我在我的 js 文件中添加 vue.use(component) 如下所示:

 import AttributeValues from './components/AttributeValues.vue'
    Vue.use(AttributeValues);
    
    Vue.component('attribute-values', require('./components/AttributeValues.vue').default, {
        name: 'attribute-values'
    });

希望它能解决某人的问题。


推荐阅读