vue.js hyphened属性未在组件中正确解释

我在Vue.js中定义了一个自定义模态组件 . 但是，我偶然发现了一个我想要了解得更好的错误 . 你看，我的模态是一个简单的确认对话框，带有是/否按钮 . 感谢Vue的模板功能，我能够进行设置，因此我可以在应用程序中为每个确认对话框重用我的组件 . 你看，为了使这项工作，我不得不将“ID”属性变成一个参数 . 这是代码：

Vue.component('modal-confirm', {
        props: ['message', 'mod_id'],
        template:`
        <div class="modal fade" :id="mod_id" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header alert-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title text-primary"><i class="fa fa-share-alt"></i> Confirmation</h4>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-lg-12">@{{ message }}</div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <modal-confirm-btn etiquette="Oui" valeur="true" url="{{ url('/api/reportsrenew/deliverReport') }}" v-on:modal_confirm="modalConfirm"></modal-confirm-btn>
                        <modal-confirm-btn etiquette="Non" valeur="false" url="{{ url('/api/reportsrenew/deliverReport') }}" v-on:modal_confirm="modalConfirm"></modal-confirm-btn>
                    </div>
                </div>
            </div>
        </div>
        `,
        methods:{
            emit: function(valeur, url){
                this.$emit('modal_confirm',  valeur, url ); 
            }
        },
        components: {
            'modal-confirm-btn': {
            template: '<button v-on:click="emit" data-dismiss="modal" type="button" class="btn btn-default btn-sm btn-primary">@{{ etiquette }}</button>',
            props:['etiquette', 'valeur', 'url'],
            methods:{
                emit: function(){
                    this.$emit('modal_confirm',  this.valeur, this.url ); 
                    }
                }
            }
        }
    });

现在，正如您所看到的，在“props”中，我已经定义了我在模板中使用的“mod_id”属性 . 但是，如果我尝试使用“mod-id”作为属性名称，我会收到错误消息

属性或方法“mod”未在实例上定义，但在呈现期间引用 . 确保在数据选项中声明反应数据属性 .

我只想知道为什么在这个特定用途的属性名称中不允许使用连字符 .