php - Laravel5.4+Vue ne peut pas lier les données les plus simples

Question

Code JS :

nouvelle Vue({

    el : '#app',
    data : {
        aa : 1
    }
})

Imprimer sur la page :
@{{ aa }}

Normalement, "1" doit être imprimé sur la page, mais il continue de signaler des erreurs. Le message d'erreur est : La propriété ou la méthode "aa" n'est pas définie sur l'instance mais référencée lors du rendu. Assurez-vous de déclarer les propriétés de données réactives dans le fichier. option de données .

Le VUE référencé est app.js généré après l'installation de npm sous le framework Laravel. Si vous passez au vue.js indépendant téléchargé depuis le site officiel, l'erreur ne sera pas signalée et "1" sera imprimé sur la page. Pourquoi est-ce le cas ? Pour les débutants, je ne comprends pas très bien. Y a-t-il un problème avec le fichier app.js généré ? Ou y a-t-il un problème avec ma configuration package.json
package.json:
{
"private": true,
"scripts": {

"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"

},
"devDependencies": {

"axios": "^0.15.3",
"bootstrap-sass": "^3.3.7",
"cross-env": "^3.2.3",
"jquery": "^3.1.1",
"laravel-mix": "0.*",
"lodash": "^4.17.4",
"vue": "^2.1.10"

}
}

Quelqu'un a-t-il rencontré ce problème ? Pourriez-vous m'aider à y répondre, merci beaucoup

.

Answer 1

el: '#app',
    data() {
        return {
            aa:1
        }
    }

Answer 2

L'utilisation de vue-cli est un peu différente du référencement de vue.js. Dans vue-cli, les données sont une méthode, pas un objet. Elles doivent être écrites sous la forme

.

data(){
  return{
     aa:11
   }
}