vue -- element-UI 初次教程 ico autoOpen

    xiaoxiao2022-07-05  171

    正式开发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, // https

      autoOpenBrowser: true,

     

    最新回复(0)