正式开发vue页面 第一课
前面有详细安装步骤 、初始化项目
npm i element-ui -S
src--》main.js
import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(ElementUI)
初始化页面
<el-button size="small" @click="go()">查询</el-button>
router
import v from '@/page/v' export default new Router({ routes: [ { path: '/v', name: 'v', component: v } ] })<script> export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App' } }, created() { this.msg='Welcome to king' }, methods: { go(){ this.$router.push({ name: 'v', params: { data: true } }) } } } </script> export default { name: 'v', data () { return { msg: 'Welcome to king Vue.js App' } }, created() { this.msg=this.$route.params.data } } </script>
接收传过来的值
二、vue 项目中,配置图标和文字
1. 在网站根目录下的 index.html 文件的title 标签中添加标题栏文字
2. 将图片.ico 文件放在网站根目录下
3. 修改 build 文件夹下 webpack.prod.conf.js 和 webpack.dev.conf.js 文件
new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', favicon: path.resolve('king.ico'), inject: true }),
自动加载浏览器
host: '127.0.0.1', // can be overwritten by process.env.HOST port: 8521, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, notifyOnErrors: true, poll: false, // httpsautoOpenBrowser: true,