nuxt-user-agent

KO | EN

gitlite — search

#hacktoberfest #typescript #go #golang #android #rust #java #windows #awesome #cli #vue #pytorch #openai #ios

nuxt-user-agent

(★ 122)

Nuxt.js module for handling User-Agent.

nuxt-user-agent Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# nuxt-user-agent

[Nuxt.js](https://nuxtjs.org/) module for handling User-Agent.

Inspired by [rack-user-agent](https://github.com/k0kubun/rack-user_agent) and, Thanks to [woothee](http://woothee.github.io/) :pray:

## Setup

Install with yarn:

`yarn add nuxt-user-agent`

Install with npm:

`npm install nuxt-user-agent`

nuxt.config.js

```js
module.exports = {
  modules: [
    'nuxt-user-agent',
  ]
}
```

## Usage

### Component

##### asyncData

```js
asyncData(context) {
  const deviceType = context.$ua.deviceType()
  return { deviceType }
}
```

##### methods/created/mounted/etc

```js
methods: {
  something() {
    const deviceType = this.$ua.deviceType()
    this.deviceType = deviceType
  }
}
```

##### Store actions

```js
// In store
{
  actions: {
    getDeviceType ({ commit }) {
      const deviceType = this.$ua.deviceType()
      commit('SET_DEVICE_TYPE', deviceType)
    }
  }
}
```

##### template

```vue
<template>
  <section>
    <div v-if="$ua.isFromPc()">
      <span>PC</span>
    </div>
    <div v-if="$ua.isFromSmartphone()">
      <span>Smartphone</span>
    </div>
    <div v-if="$ua.isFromMobilephone()">
      <span>Mobilephone</span>
    </div>
    <div v-if="$ua.isFromTablet()">
      <span>Tablet</span>
    </div>
    <div v-if="$ua.isFromAppliance()">
      <span>Appliance</span>
    </div>
    <div v-if="$ua.isFromCrawler()">
      <span>Crawler</span>
    </div>
  </section>
</template>
```

## Methods

## TODO
- [ ] unit test

## License
The npm is available as open source under the terms of the [MIT License.](https://opensource.org/licenses/MIT)

nuxt-user-agent

nuxt-user-agent Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

nuxt-user-agent

nuxt-user-agent Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README