Vue不会渲染组件之一。没有错误，甚至在DOM中也没有显示，对我来说似乎很正确

Question

我有两个组件，其中一个不想渲染。它甚至出现在DOM中。我认为我弄乱了一些路径，依此类推，但是如果它在DOM中显示，那么evrything还可以。我不知道要在此处附加代码的哪一部分供您查看..因此将附加

picture of a DOM

我的App.vue的开头

       <template>
                    <div>
                    <field-modal></field-modal>
                    <form> // All below just renders fine
                            <div class="progress">
                                    <div class="progress-bar" :style="progressBar"></div>
                            </div>
                            <fileds-registration v-for="(field, i) in info">
                            </fileds-registration>
                            <button class="btn btn-primary" :disabled="!isButton">
                                    Send Data
                            </button>
                    </form>
                    </div>
            </template>
<script>
        import FiledsRegistration from './components/Action.vue';
        import FieldModal from './components/Modal.vue';
export default {
        components: {
                FiledsRegistration,
                FieldModal
        },
        data(){ .......

以及我不想渲染的整个组件Modal.vue文件

<template>
        <div class="modal">
                <p>Here we go</p>
        </div>
</template>
<script>
        export default
        {
                components: {
                },
                data(){
                        return {

                        }
                }
        }
</script>
<style scoped>
        .modal
        {
                width: 500px;
                height: 500px;
                background: blue;
        }
<style>

Answer 1

您是否检查了计算出的样式？也许某些继承的样式正在崩溃吗？也许字号太小？我可以看到div本身已被选中（以灰色突出显示）