Nuxt.js 教程
Nuxt.js 介绍
关于 Nuxt.js 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了 Next.js,一个 React 的服务端渲染应用框架。几小时后,…
Nuxt.js 安装
Nuxt.js 十分简单易用。一个简单的项目只需将 nuxt 添加为依赖组件即可。 运行 create-nuxt-app 为了快速入门,Nuxt.js团队创建了…
Nuxt.js 目录结构
Nuxt.js 的默认应用目录架构提供了良好的代码分层结构,适用于开发或大或小的应用。 当然,你也可以根据自己的偏好组织应用代码。 目录 资源目录 资源目录 assets…
Nuxt.js 配置
Nuxt.js 默认的配置涵盖了大部分使用情形,可通过 nuxt.config.js 来覆盖默认的配置。 build Nuxt.js 允许你在自动生成的 vendor.b…
Nuxt.js 视图
本章节的内容阐述了如何在 Nuxt.js 应用中为指定的路由配置数据和视图,包括应用模板、页面、布局和HTML头部等内容。 模板 你可以定制化 Nuxt.js 默认的应用模板。 定…
Nuxt.js 异步数据
Nuxt.js 扩展了 Vue.js,增加了一个叫 asyncData 的方法,使得我们可以在设置组件的数据之前能异步获取或处理数据。 asyncData 方法…
Nuxt.js 资源文件
默认情况下 Nuxt 使用 vue-loader、file-loader 以及 url-loader 这几个 Webpack 加载器来处理文件的加载和引用。对于不需要通过 Webp…
Nuxt.js 插件
Nuxt.js允许您在运行Vue.js应用程序之前执行js插件。这在您需要使用自己的库或第三方模块时特别有用。 需要注意的是,在任何 Vue 组件的生命周期内, 只有 b…
Nuxt.js Vuex 状态树
对于每个大项目来说,使用状态树 (store) 管理状态 (state) 十分有必要。这就是为什么 Nuxt.js 内核实现了 Vuex。 使用状态树 Nuxt.js 会…
Nuxt.js 支持 TypeScript
Nuxt.js 对 typescript 有着完整的支持包括(包括运行和编译期)。文档请参阅 https://typescript.nuxtjs.org/
Nuxt.js 命令
Nuxt.js 提供了一系列常用的命令, 用于开发或发布部署。 命令列表 命令 描述 nuxt 启动一个热加载的Web服务器(开发模式) localhost:3000。 …
Nuxt.js 开发工具
测试是 Web 应用开发过程中不可获缺的工作。Nuxt.js 尽量帮助你简化这部分工作。 端对端测试 ava 是一个很强大的 JavaScript 测试框架,结合&nbs…
Nuxt.js asyncData 方法
asyncData 方法 你可能想要在服务器端获取并渲染数据。Nuxt.js添加了asyncData方法使得你能够在渲染组件之前异步获取数据。 类型: Function …
Nuxt.js fetch 方法
fetch 方法 fetch 方法用于在渲染页面前填充应用的状态树(store)数据, 与 asyncData 方法类似,不同的是它不会设置组件的数据。 类型: Func…
Nuxt.js key 属性
key 属性 设置内部组件的key属性 类型: String 或 Function key属性赋值到<router-view>,这对于在动…
Nuxt.js layout 属性
layout 属性 layouts 根目录下的所有文件都属于个性化布局文件,可以在页面组件中利用 layout 属性来引用。 类型: Str…
Nuxt.js loading 属性
loading 属性 loading属性为您提供了禁用特定页面上的默认加载进度条的选项。 类型: Boolean (默认: true) 默认情况下,N…
Nuxt.js middleware 属性
middleware 属性 在应用中的特定页面设置中间件 类型: String 或 Array数组元素类型: String 例子: page…
Nuxt.js transition 属性
transition 属性 Nuxt.js 使用 Vue.js 的组件来实现路由切换时的过渡动效。类型: String 或 Object 或…
Nuxt.js validate 方法
validate 方法 Nuxt.js 可以让你在动态路由对应的页面组件中配置一个校验方法用于校验动态路由参数的有效性。 类型: Function validate({ …