vue.js 如何用Nuxt设置html元素的lang属性?

iswrvxsc  于 2022-11-17  发布在  Vue.js
关注(0)|答案(2)|浏览(319)

使用文件nuxt.config.js文件,可以自定义head内容以添加一些 meta或其他内容:

module.exports = {
  /*
  ** Headers of the page
  */
  head: {
    title: 'awesome title',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Nuxt.js project' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  ...
}

但是我在文档中找不到任何东西来设置html元素的属性--我想设置lang属性。有什么方法可以做到这一点吗?

u5i3ibmn

u5i3ibmn1#

来源:Declaring language in HTML tag · Issue #388 · nuxt/nuxt.js
head支持htmlAttrs属性。它将对象的每个键:值Map为属性:值

module.exports = {
  head: {
    htmlAttrs: {
      lang: 'en'
    }
  }
}
ut6juiuv

ut6juiuv2#

在Nuxt 3中,键入组件

<script setup>
useHead({
  htmlAttrs: {
    lang: 'en',
    style: 'font-size: 13px'
  }
})
</script>

https://v3.nuxtjs.org/getting-started/seo-meta/

相关问题