地区三级联动，新手容易只出现 {{name}} 的一个隐蔽原因

不是你说的这个问题。是你的app.js引入SelectDistrict.js的时候重复声明了app对象。删掉一个就行了。

是啊，注释或删除掉一个就ok了。
// 此处需在引入 Vue 之后引入 。地区联动。
window.Vue = require('vue');
require('./components/SelectDistrict');

//
// const app = new Vue({
// el: '#app'
// });

// Vue.component('example-component', require('./components/ExampleComponent.vue').default);

把这行注释掉就行了

@bing_ 我没注释 console之前是 Uncaught TypeError: Vue is not a constructor，注释后不报错了，但依旧是 {{ name }}

兄弟我和你一样，但是我找到解决办法了，这里可以分享一下，我看了一下 github 上的源码，发现有行代码不一样
github.com/summerblue/laravel-shop...
我们默认的是

window.Vue = require('vue');

改成，多了一个 .default

window.Vue = require('vue').default;

我的 app.js 如下

require('./bootstrap');
window.Vue = require('vue').default;
require('./components/SelectDistrict');
const app = new Vue({
    el: '#app',
});

解释如下

1. 也不需要把 SelectDistrict.js 改为 SelectDistrict.vue
2. 使用 require 是 CommonJS 的模块导入方式，不支持模块的默认导出，因此导入的结果其实是一个含 default 属性的对象，因此需要使用 .default 来获取实际的组件选项。

require('./bootstrap');
window.Vue = require('vue');
// 此处需在引入 Vue 之后引入
require('./components/SelectDistrict');

const app = new Vue({
el: '#app'
});

用这个可以

还有一个原因是可能是还没有编译好 检查 package.json 中是否有这三个文件 "vue": "^2.5.17", "vue-loader": "^15.9.5", "vue-template-compiler": "^2.6.10"

如果没有,记得添加进去 把package-lock.json文件 node_modules文件夹删除 运行 npm install npm run dev 就可以正常了