Nuxt 使用感悟2

使用第三方组件

全部页面都使用,在nuxt.config.js添加plugins,当然首先要安装element

head: {
title: ‘首页’,//process.env.npm_package_name || ‘’,
meta: [
{ charset: ‘utf-8’ },
{ name: ‘viewport’, content: ‘width=device-width, initial-scale=1’ },
{ hid: ‘description’, name: ‘description’, content: process.env.npm_package_description || ‘’ }
],
link: [
{ rel: ‘icon’, type: ‘image/x-icon’, href: ‘/favicon.ico’ },
{ rel: ‘stylesheet’, href: ‘/css/common.css’ }
]
},
/*
** Global CSS
*/
css: [
‘element-ui/lib/theme-chalk/index.css’
],
plugins: [
‘@/plugins/element-ui’
],

单个页面使用

import elementui from ‘element-ui’;

动态引入组件

    <keep-alive>
    <component :is="componentname"></component >
    </keep-alive>

components:{
sale1:() => import(’~/components/sale1’),
sale2:() => import(’~/components/sale2’)
}
能减少初进入系统的加载时间,起码看起来快了

修改化页面的头部

head:{
  title:"工具",
  link: [
  { rel: 'icon', type: 'image/x-icon', href: '/logo.png' }
  ]

},

页面异步加载信息

async asyncData(){
let page=0
let {data}=await axios.get(/api/config) //异步函数运行到await就会返回,返回值是Promise
return {myconfig: data} //Vue会将这个加到data
} ,
东西太多,没法一下子全写,以后吧