$strapi
Use the $strapi inside your Nuxt app
This module globally injects $strapi
instance, meaning that you can access it anywhere using this.$strapi
. For plugins, asyncData, fetch, nuxtServerInit and Middleware, you can access it from context.$strapi
.
Properties
All properties are reactive. Meaning that you can safely use them in Vue template v-if
conditions.
user
This object contains details about authenticated user. You can access it using $strapi
.
// get user
this.$strapi.user
// set user prop
this.$strapi.user.avatar = ''
Methods
find(entity, params?)
-
Returns
Promise
Get entries. Returns entries matching the query filters. You can read more about parameters here.
The second argument params
is for query parameters:
await this.$strapi.find('products', { title: '' })
// With entity shortcut
await this.$strapi.$products.find({ title: '' })
// 1st method
await $strapi.find('products', [['categories.name', 'women'], ['categories.name', 'men']])
// With entity shortcut
await $strapi.$products.find([['categories.name', 'women'], ['categories.name', 'men']])
// Entity shortcut with additional API Parameters
await $strapi.$products.find([['categories.name', 'women'], ['categories.name', 'men'], ['_limit', '200']])
// 2nd method
await $strapi.find('products', { 'categories.name': ['women', 'men'] })
// With entity shortcut
await $strapi.$products.find({ 'categories.name': ['women', 'men'] })
// Entity shortcut with additional API Parameters
await $strapi.$products.find({ 'categories.name': ['women', 'men'], _limit: 200 })
// 1st method
"?categories.name=woman&categories.name=men"
// 2nd method
"?categories.name=women%2Cmen"
See the Strapi endpoints.
count(entity, params?)
-
Returns
Promise
Count entries. Returns the count of entries matching the query filters. You can read more about parameters here.
await this.$strapi.count('products', params)
// With entity shortcut
await this.$strapi.$products.count(params)
See the Strapi endpoints.
findOne(entity, id, params?)
-
Returns
Promise
Get an entry. Returns an entry by id.
await this.$strapi.findOne('products', 1)
// With entity shortcut
await this.$strapi.$products.findOne(1)
Like the find
method, you can pass optional query params as a third argument:
await this.$strapi.findOne('products', 1, { _publicationState: 'preview' })
See the Strapi endpoints.
create(entity, data)
-
Returns
Promise
Creates an entry and returns its value.
await this.$strapi.create('products', { title: '' })
// With entity shortcut
await this.$strapi.$products.create({ title: '' })
See the Strapi endpoints.
update(entity, id, data)
-
Returns
Promise
Partially updates an entry by id and returns its value. Fields that aren't sent in the query are not changed in the db. Send a null value if you want to clear them.
await this.$strapi.update('products', 1, { title: '' })
// With entity shortcut
await this.$strapi.$products.update(1, { title: '' })
See the Strapi endpoints.
delete(entity, id)
-
Returns
Promise
Deletes an entry by id and returns its value.
await this.$strapi.delete('products', 1)
// With entity shortcut
await this.$strapi.$products.delete(1)
See the Strapi endpoints.
graphql(data)
-
Returns
Promise
Performs an HTTP request to GraphQL API and returns its value
const restaurantId = 4;
await strapi.graphql({
query: `query {
restaurant(id: ${restaurantId}) {
name
phone
owners {
first
last
}
}
}`
});
import gql from "graphql-tag";
export function getRestaurant() {
const query = gql`
query getRestaurant($id: Int!) {
restaurant(id: $id) {
name
phone
owners {
first
last
}
}
}`;
return query.loc.source.body;
}
import { getRestaurant } from 'restaurants.js'
const restaurantId = 4;
await this.$strapi.graphql({
query: getRestaurant(),
variables: {
id: restaurantId
}
})
register(form)
-
Returns
Promise
Register using local strategy. Sets the User and Token.
await this.$strapi.register({ username: '', email: '', password: '' })
See the Strapi documentation.
login(form)
-
Returns
Promise
Login using local strategy. Sets the User and Token.
await this.$strapi.login({ identifier: '', password: '' })
See the Strapi documentation.
forgotPassword(form)
-
Returns
Promise
await this.$strapi.forgotPassword({ email: '' })
See the Strapi documentation.
resetPassword(form)
-
Returns
Promise
Reset password. Sets the User and Token.
await this.$strapi.resetPassword({ code: '', password: '', passwordConfirmation: '' })
See the Strapi documentation.
sendEmailConfirmation(form)
-
Returns
Promise
await this.$strapi.sendEmailConfirmation({ email: '' })
See the Strapi documentation.
logout()
Clears the user
and jwt
in cookies.
this.$strapi.logout()
fetchUser()
-
Returns
Promise
Fetch me
user from /users/me
route if a jwt
is present in the cookies. Sets the jwt
inside $http
. Sets the User.
This method is called by default on init, so you don't have to.
ssr
mode, this method is called on the server-side only and the data are hydrated client-side so the HTTP call happens only once.setUser(user)
Set user data.
this.$strapi.setUser(user)
You can use the
$strapi.user
property to mutate the object instead of overriding theuser
.
getToken()
Returns jwt
from cookies.
this.$strapi.getToken()
setToken(token)
Sets token inside $http
as a jwt Bearer
.
Store jwt
in cookies
.
this.$strapi.setToken(token)
clearToken()
Remove jwt
from $http
and $cookies
.
this.$strapi.clearToken()
Extends
$http
This module uses @nuxt/http under the hood, you can access it directly from there:
await this.$strapi.$http.$get(/* .... */)
$cookies
This module uses cookie-universal-nuxt under the hood, you can access it directly from there:
this.$strapi.$cookies.set('key', 'value')