Search Results

Use the search box on the top of the page to search posts in JavaScript

Using Vues class function in your own composables

Inside your <template>, you may be used to stacking lots of conditionally applied classes onto elements. You can add dynamic classes (e.g. .btn--${props.type}), arrays of conditional if/else classes (e.g. props.error ? 'has-error' : 'is-valid') or even whole objects of conditionals (e.g. { 'is-disabled': props.disabled }. But what do we do…

Vue3 Auto Vite Components

Install the package with one of the following: // NPMnpm i vue3-auto-vite-components // Yarnyarn add vue3-auto-vite-components While standard auto-import loaders use the build process (i.e. a plugin for Vite or Webpack) to automatically import/register your components, this package takes a slightly different tack and instead uses built-in Vue and Vite…

Passing through slots in Vue

If you’re keeping your Vue component sizes small, there’s a good chance you’ll need to implement a wrapper component at some point. If you’re only utilising the default slot for these, it can be as simple as putting a <slot /> tag inside your wrapper component. However, there’s a bit…

Composable Design Patterns in Vue 3

Back in the days of Vue 2, the mixin was king. Had some code you wanted to reuse in separate components? Create a mixin, import and register it in the component and its provided props, data and methods would magically be available. The problem with mixins was that magic. You’d…

Automatic Vue Component Registration with Vite

Developing a large web application is a constant struggle to not keep writing the same things over and and over again. Part of this can be the need to continually import your components within a Vue application. While there are some great tools to help automatically register all of your…
Showing 1 to 5 of 5 items
Copyright 2007 - 2024 southcoastweb is a brand of DSM Design.