Как избежать дублирования методов в Nuxt.js

143
23 ноября 2018, 16:50

Всем привет.
Работая над одним проектом(сам новичок) столкнулся со следующей дилеммой:

Допустим у меня есть такой метод:

methods:{
  rquire_img(img){
    return require('~static/img/' + img);
  }   
 }

Этот метод мне приходиться вызывать чуть ли не в каждом модуле. Возникает желание вынести как то этот метод отдельно и подключать(если это возможно) в каждый компонент.

Вопрос: Как это сделать правильнее всего с точки зрения семантики ну и вообще проектирования проекта? (+ что бы реактивность состояний при этом так же сохранялась на прежнем уровне у этого подключаемого метода.)

И главное как потом навешивать эти подключения метода на разные теги? Имею виду подключение через:

:src="require_img(бла..бла..бла..)"

Answer 1

Можно через примесь(mixin) или добавить эту функцию в файл с хелперами, оттуда импортировать и вставлять в methods.

helpers.js:

export function rquire_img (img)
  return require('~static/img/' + img);
}

В компоненте:

import { rquire_img } from '../helpers'

В методах:

methods: {
   rquire_img, // сокращение от rquire_img: rquire_img 
   ...
}
READ ALSO
Gulp и API prettier

Gulp и API prettier

Как мне прогнать файл styles/stylecss через через галп, с помощью prettier ?

139
Axios выполняет два запроса по post

Axios выполняет два запроса по post

Доброго времени суток есть скрипт, который постит новость в базу, к нему при помощи AXIOS пробрасываются данные

122
Как менять текст ссылки если блоки работают как «аккордеон»?

Как менять текст ссылки если блоки работают как «аккордеон»?

Есть форма с даннымиПри клике на ссылку, раскрывается дополнительный блок под ним

151
setState не обновляет состояние

setState не обновляет состояние

Вот два компонента, при нажатии на MainWord появляется MainWordStand - окошкоНо при нажатии на крестик на этом окошке для его закрытия, не происходит...

182