Vue.js / NuxtJSで困った事と解決方法

checkboxをデフォルト選択状態(checked)にしたいけどできない

ロード時にcheckedになるのに、最終的には外されてしまう。

調べると、v-modelで連携しており、外すと選択状態にできた。

そもそもこう言う事らしい。

v-model は任意の form 要素にある value、checked または selected 属性の初期値を無視します。input または textarea は常に、信頼できる情報源として Vue インスタンスを扱います。コンポーネントの data オプションの中で JavaScript 側で初期値を宣言する必要があります。

解決策

dataプロパティの初期値に、選択状態にしたいvalueを配列で入れておくと、選択状態にできる。

 

Nuxtjsでサイトマップ(sitemap.xml)を自動生成したい

@nuxtjs/sitemap

↑を導入することで可能。

npm install @nuxtjs/sitemap

nuxt.config.jsのmodulesに追加する

modules: [
  // Doc: https://axios.nuxtjs.org/usage
  '@nuxtjs/axios',
  '@nuxtjs/pwa',
  // Doc: https://github.com/nuxt-community/dotenv-module
  '@nuxtjs/dotenv',
  '@nuxtjs/sitemap'
],