weixin_43294560的博客

服务端渲染 SSR 原理和实现。

1、安装 cnpm install @nuxtjs/proxy -D2、在nuxt.config.js中设置 modules:[ '@nuxtjs/axios', '@nuxtjs/proxy' ], axios:{ proxy:true }, proxy:{ '/api':{ target:'http://xxx.com', changeOrigin:true, pathRewrite:{ '^/api':'/' } } } 3、

方式一: 在store下创建state.js,actions.js,mutations.js和getters.js 在组件中使用的方式和正常一样方式二: 方式二中的方式一: 创建index.js作为根模块 export const state = () => ({ counter: 0 }) export const mutations = { increment(state) { state.counter++ }

1、自定义布局 使用layouts中的顶级文件布局 (1)在放置进布局的组件中,data同级 layout: 'layouts中的顶级文件名称,无.vue后缀' (2)在layouts中的顶级文件中 <Nuxt /> 标注组件放置位置2、在layouts中创建error.vue 显示应用错误（404，500 等）的组件3、组件额外添加的方法,和data同级 asyncData 最重要的一个键, 支持 异步数据处理，另外该方法的第一个参数为当前页面组件的 上下文

在pages下的文件.vue文件会被自动加载成路由 1、定义一级路由 在pages下创建.vue文件,访问路径后加上/文件名,访问 index.vue对应的路径为'/'; 2、创建多级路由 在pages创建文件夹,文件夹内创建.vue文件 访问路径:/文件夹名/文件名 pages/ --| user/ -----| index.vue -----| one.vue --| index.vue 将被转换成: router: { routes: [ {

1、通过脚手架创建项目 npx create-nuxt-app 项目名称2、运行 npm run dev启动页面:

1、安装 npm install vue vue-server-renderer --save 2、引入 const Vue = require('vue')3、创建实例 const app = new Vue({ data:{参数键值对} template: `反引号内书写html内容,用法和正常使用vue一样`, methods:{...}, 生命周期(){...} })4、将 Vue 实例渲染为 HTML,如果没有传入回调函数，则会返回 Promise：