2
Help us understand the problem. What are the problem?

posted at

updated at

Vue-CLI3でjQueryを使う

最近「jQueryいらない」みたいな風潮ですが、
「bodyにclass追加したい」と思ったら、jQueryを使うのが速い。
使い分け大事

$ npm install --save-dev jquery

Vue-CLI-uiを使うとさらに簡単です。
スクリーンショット 2019-06-07 18.44.11.png

App.vueに読み込む

App.vue
<template>
  <div id="app">
    <router-view />
  </div>
</template>
<script>
import $ from 'jquery' // ← 読み込む
export default {
  //(省略)
}
if(navigator.userAgent.indexOf('Android')>0){
  $("body").addClass("Android"); // ← 書ける
};
</script>

スクリーンショット 2019-06-07 18.51.40.png

コレでAndroid用のCSSが書ける。

【追記】
あれ、ココに書いてDOMの操作できるっけ ??
mounted(){}の中に書いたほうが良いと思う。

App.vue
<script>
import $ from 'jquery' // ← 読み込む
export default {
  //(省略)
  mounted(){
    if(navigator.userAgent.indexOf('Android')>0){
      $("body").addClass("Android"); // ← 書ける
    };
  },
}
</script>
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
2
Help us understand the problem. What are the problem?