Vuejs 2 将道具发送到 xxx.vue 文件

Question

通常你这样发送道具

Vue.component('child', {
  // camelCase in JavaScript
  props: ['myMessage'],
  template: '<span>{{ myMessage }}</span>'
})

我怎样才能实现要求：

Vue.component('lw-login', require('./components/login.vue'));

Laravel Blade 模板：

<lw-login
        heading="Login"
        action="{{ route('login') }}"
        email="E-mailadres"
        passwordrequest="{{ route('password.request') }}"
></lw-login>

login.vue: 见{{标题}} 我收到此错误：

[Vue warn]: Property or method "heading" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.

（在 C:\Code\cms\resources\assets\js\components\login.vue 中找到）

<template>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="panel panel-default">
                    <div class="panel-heading">{{ heading }}</div>
                    <div class="panel-body">
                        <form class="form-horizontal" role="form" method="POST" :action="action">


                            etc .....

<script>
    export default {
        mounted() {
            props: ['heading','action','passwordrequest']
        }
    }
</script>

Answer 1

改变了这个：

<script>
    export default {
        mounted() {
            props: ['heading','action','passwordrequest'],
        }
    }
</script>

为此:)) :

<script>
    export default {
        props: ['heading','action','passwordrequest'],
        mounted() {

        }
    }
</script>

Vuejs 2 将道具发送到 xxx.vue 文件

Vuejs 2 Sending props to xxx.vue file

vue.js

vue-component

vuejs2