Задать вопрос

MaxRyazan

Комментарии

  • Как создать файл конфигурации для библиотеки?

    @MaxRyazan Автор вопроса
    Сергей Левченко,
    Покрутив ваши варианты так и сяк, я не смог решить проблему, однако, ваши рассуждения подтолкнули меня на верный путь, и в конце концов я закрыл вопрос.
    Суть в том, что когда мы регистрируем плагин, у нас есть доступ к объекту app и мы можем им управлять как нам нужно. В моём же случае, в функции defineConfig нет доступа до этого объекта, и контекст приложения не получается переопределить в родителе.

    const defineConfig = (options) => {
  window.$myPluginConfig = options;
};

    делать так я не стал, поскольку не уверен в надежности этого метода для разных браузеров.

    Мое решение на текущий момент переопределять конфиг до момента mount приложения в main файле.

    const app = createApp(App)

defineConfig({
    iconsBasePath: '/'
}, app)

app.mount('#app')


    Таким образом оно работает как нужно и проблем нет.. за исключением того, что хотелось бы конфиг всё таки вместе с функцией вынести в отдельный файл.
    Возможно я решу эту проблему созданием отдельного плагина именно для конфигурации, и интегрирую его в библиотеку. Тогда появится возможность сделать так:

    const app = createApp(App)
app.use(MyLib)
      .mount('#app')


    // файл конфигурации, например, my-lib.config.js
import {defineConfig} from 'my-lib'

export default defineConfig({
    iconsBasePath: '/'
})


    Если у вас появились мысли на этот счет, буду рад выслушать. Через день или два отмечу ответ "верным решением".
    Спасибо.
    Написано

  • Как создать файл конфигурации для библиотеки?

    @MaxRyazan Автор вопроса
    причем здесь плагин вообще?
    я не использую глобальную регистрацию компонентов - это фигня, которая только распухает итоговый бандл. Все компоненты импортируются по мере необходимости прямо в vue шаблоне.

    мне нужно понять как реализовать defineConfig для моей библиотеки, чтобы компоненты, которые я оттуда использую можно было кастомизировать до определенных пределов в приложении - "родителе".
    Например, пути для иконок, какие то основные настройки и тп.

    Например, у меня в библиотеке, компонент, отрисовывающий svg в переиспользуемом компоненте смотрит на публичную папку public, а пользователя библиотеки не устраивает папка public и он хочет public/icons

    хотелось бы чтобы можно было сделать так:

    // mylib.config.js
export default defineConfig({
     iconsBasePath: 'public/icons'
})
    Написано

  • Как создать файл конфигурации для библиотеки?

    @MaxRyazan Автор вопроса
    спасибо, есть какая то ссылка куда сходить почитать или посмотреть?
    Написано

  • Как использовать :key в пользовательской директиве?

    @MaxRyazan
    Вообще нет. Специально для тебя открыл девтулзы и проверил количество листренов) сколько элементов с этой директивой на странице, столько и слушателей - и после открытия-закрытия элементов тоже)

    И обработчики удаляются, мистер куратор - потому что мы передаём в директиву функцию, пусть и анонимную, и и засовываем её в листенер, а потом такой же листенер с этой же функцией и удаляем.
    Если куратор не заметил, bind.value() - это и есть обработчик. И в add и в remove он одинаковый
    Написано

  • Как использовать :key в пользовательской директиве?

    @MaxRyazan
    куратор отписал бред)
    работаю с этим проектом почти год и ни 1 проблемы,)
    и работает, и закрывается и удаляются евент листнеры)
    Вы вообще поняли, что там написано? Судя по комменту - совсем нет
    Написано

  • Почему в браузере постоянно вылезает капча?

    @MaxRyazan Автор вопроса
    Да, при открытии рандомных страниц )
    нет, нету ни прокси, ни впн.
    Написано

  • Yandex maps v3 как получить все точки маршрута?

    @MaxRyazan
    Так что, решил проблему? Построение маршрутов - бесплатное? Мне просто предлагают оплатить Матрицу расстояний и построения маршрута.. Тоже пытаюсь подключить в свой проект
    Написано

  • Почему при подключении аккаунт gitlab выдает ошибку?

    @MaxRyazan
    у меня в вебшторме вообще не подключается к гитлаб через токен или пароль / логин. Тоже рисует ошибки.
    Моё решение - пушить через терминал винды. Со временем ошибка в вебшторме пропадает (после 2-3 пушей)
    Написано

  • Vue3 Как указать ссылку на компонент по текстовому значению его имени?

    @MaxRyazan 
    enum MyComponents {
   one = "ComponentOne",
   two = "ComponentTwo",
   three = "ComponentThree",
}

const currentComponent = shallowRef()

onMounted(async () => {
 const component =  await axios.get()
 switch (component) {
  case MyComponents.one:  currentComponent .value = ComponentOne,
break
  case MyComponents.two:  currentComponent .value = ComponentTwo
break
  case MyComponents.three:  currentComponent .value = ComponentThree
break
}
})
    Написано

  • Как в компоненте Vue3 следить за переменной родителя?

    @MaxRyazan 
    watch(() => props.modelValue, () => {
  if(props.modelValue) update()
},{immediate: true})


    Это чтобы отрабатывало сразу при отрисовке
    Написано

  • Какой алгоритм получения ролей и прав пользователя на фронт vue или react и как их хранить?

    @MaxRyazan
    как всегда есть несколько способов реализации.

    В простом случае можно сделать второй енам с пермишнами, если нужно поделить логику работы

    enum IRores  {
 ADMIN = 'admin',
 MODERATOR='moderator',
 USER = 'user',
 BLACK_USER='black_user'
}
enum IPermissions{
 WRITE = 'write',
 READ = 'read',
 UPDATE='update'
 DELETE='delete'
 ALL='all'
}

const ROLES_PERMISSIONS = new Map([
[IRoles.Admin, [IPermissions.ALL]],
[IRoles.MODERATOR, [IPermissions.READ, IPermissions.WRITE,  IPermissions.UPDATE],
[IRoles.USER , [IPermissions.READ,  IPermissions.WRITE]],
[IRoles.BLACK_USER, [IPermissions.READ]],
])

const currentUserPermissions = ROLES_PERMISSIONS.get(currentUser.role)


    <div v-if="currentUserPermissions.includes(ROLES_PERMISSIONS.DELETE)">some content</div>


    Этот вариант является самым простым, и сделан только с целью показать что это вообще такое.
    Да, его можно заменить на 1 большой енам, но суть примера - показать именно примитивный вариант.

    Если проект сложный и ролей/пермишнов много, создаётся класс, где расписывается конкретная логика работы.
    Написано

  • Какой алгоритм получения ролей и прав пользователя на фронт vue или react и как их хранить?

    @MaxRyazan
    обычно на фронте есть enum с ролями, по которым и идёт сопоставление.

    enum IRores  {
 ADMIN = 'admin',
 USER = 'user'
}


    <div v-if="currentUser.role === IRoles.ADMIN"></div
   <div :v-role="[IRoles.ADMIN]"></div


    простой пример, без какого либо контекста. Оба дива будут отображаться если у текущего пользователя, сохранённого на фронте роль АДМИН.

    Во втором случае просто создана кастомная директива для удобства
    Написано

  • Как скопировать данные из пропса в дочернем компоненте?

    @MaxRyazan 
    const switcher = ref(widget.active)
const emits = defineEmits<{
(e: 'editWidget', param: any) : void
}>()

<el-switch size="small" v-model="switcher" inline-prompt/>

watch(switcher , () => {
   emits('editWidget', switcher.value)
})


    В родителе ловишь этот эмит с новым значением и переопределяешь его у виджета, отправляешь на бэк, получаешь ответ - и вуаля, массив виджетов обновлён и изменения учтены
    Накидал на скорую руку на во время шашлыков, так что не суди строго )
    Написано

  • Как скопировать данные из пропса в дочернем компоненте?

    @MaxRyazan
    приведи код, без кода ничего не понятно
    Написано

  • Не работают @media-query на Vue 2, как исправить?

    @MaxRyazan
    попробуй не медиа запросы, а контейнерные запросы
    https://developer.mozilla.org/en-US/docs/Web/CSS/@...

    Возможно еще что у тебя не верный порядок подключения файлов css - например, медиа запросы подключены выше, чем определены стили.

    Типа в главном файле стилей написано так:
    @import file-with-media from './'

... а потом тут переопределены стили контейнеров которые подпадают под медиа запросы
    Написано

  • Почему компонент не получает данные от pinia?

    @MaxRyazan
    в геттере пустота, потому что он ссылается на пустой объект. Исходный массив пуст. Ищи причину, почему данные не приходят
    Написано

  • Не работают @media-query на Vue 2, как исправить?

    @MaxRyazan
    попробуйте потестить с другими параметрами медиазапроса

    @media (max-width: 1024) {
 ... 
}
    Написано

  • Не работают @media-query на Vue 2, как исправить?

    @MaxRyazan
    У вас в стилях max-width. Возможно в контейнере нечему растягиваться на такую ширину? Попробуйте вместо max-width протестировать с width
    Написано

  • Как дождаться загрузки всех дочерних Vue-компонентов?

    @MaxRyazan
    Aetae, если ваш ответ верен, значит ДОКУМЕНТАЦИЯ вью неверна? Куратор, мне кажется, вы не умеете признавать свои пробелы)
    Именно асинхронщина, про которую говорит уважаемый куратор и является причиной того, что я написал про эмит в конце mount. Во вью3 есть эмиты по умолчанию от дочерних компонентов, например @vue:mounted. Он отработает сразу, как mount начнёт свою работу. Но чтобы дождатся полной отработки mount дочернего компонента нужно руками создавать эмит в конце mount и его ловить в родителе.

    Так же можно использовать suspense, если нужно. Но в его случае этот вариант не подойдёт.

    И простите, но Ваш ответ не дал для разъяснения вопроса НИ-ЧЕ-ГО.
    Написано

  • Как дождаться загрузки всех дочерних Vue-компонентов?

    @MaxRyazan
    Уважаемый куратор, вы ошибаетесь. Касаемо vue3 нет гарантий, что при вызове mount родительского компонента все дочерние компоненты уже примонтированы. Об этом прямо написано в документации.
    https://v3.ru.vuejs.org/ru/api/options-lifecycle-h...

    Есть хак - можно в конце mount дочерного компонента вызвать emit, поймать его в родителе, и например, переключить флаг "isLoaded" в true.
    Затем watcher отследить переменную isLoaded, и когда она станет true - после эмита, вызвать свою функцию какую либо.
    Написано