vue#inject JavaScript Examples
The following examples show how to use
vue#inject.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: use-theme-classes.js From konsta with MIT License | 6 votes |
useThemeClasses = (props, classesObj) =>
computed(() => {
const context = inject('KonstaContext');
let theme = context.value.theme || 'ios';
if (props.ios) theme = 'ios';
if (props.material) theme = 'material';
return themeClasses(
typeof classesObj === 'function' ? classesObj() : classesObj,
theme
);
})
Example #2
Source File: initialState.js From fes.js with MIT License | 5 votes |
export default function initialStateModel() {
return inject('initialState');
}
Example #3
Source File: use-dark-classes.js From konsta with MIT License | 5 votes |
useDarkClasses = (classNames) => {
const context = inject('KonstaContext');
if (!context.value.dark) return '';
return classNames;
}
Example #4
Source File: use-theme.js From konsta with MIT License | 5 votes |
useTheme = (props = {}) =>
computed(() => {
const context = inject('KonstaContext');
let theme = context.value.theme || 'ios';
if (props.ios) theme = 'ios';
if (props.material) theme = 'material';
return theme;
})
Example #5
Source File: use-touch-ripple.js From konsta with MIT License | 5 votes |
useTouchRipple = (elRef, props, addCondition) => {
const context = inject('KonstaContext');
const ripple = ref(null);
let eventsAttached = false;
const getEl = () => {
if (!elRef || !elRef.value) return null;
let el = elRef.value;
if (el.$el) el = el.$el;
return el;
};
const theme = () => {
let value = context.value.theme || 'ios';
if (props.ios) value = 'ios';
if (props.material) value = 'material';
return value;
};
const needsTouchRipple = () => {
return (
theme() === 'material' &&
props.touchRipple &&
(addCondition ? addCondition() : true)
);
};
const removeRipple = () => {
if (ripple.value) ripple.value.remove();
ripple.value = null;
};
const onPointerDown = (e) => {
ripple.value = new TouchRipple(getEl(), e.pageX, e.pageY);
};
const onPointerMove = () => {
removeRipple();
};
const onPointerUp = () => {
removeRipple();
};
const attachEvents = () => {
if (!context.value.touchRipple || eventsAttached) return;
eventsAttached = true;
const el = getEl();
el.addEventListener('pointerdown', onPointerDown);
el.addEventListener('pointermove', onPointerMove);
el.addEventListener('pointerup', onPointerUp);
};
const detachEvents = () => {
eventsAttached = false;
const el = getEl();
el.removeEventListener('pointerdown', onPointerDown);
el.removeEventListener('pointermove', onPointerMove);
el.removeEventListener('pointerup', onPointerUp);
};
watch(
() => needsTouchRipple(),
(newV) => {
if (newV) attachEvents();
else detachEvents();
}
);
onMounted(() => {
if (!getEl() || !needsTouchRipple()) return;
attachEvents();
});
onBeforeUnmount(() => {
if (!getEl() || !needsTouchRipple()) return;
detachEvents();
});
}
Example #6
Source File: formInject.js From Ale with MIT License | 5 votes |
export function getInject() {
let alForm = inject('alForm', '');
let alFormItem = inject('alFormItem', '');
return {
alForm,
alFormItem
};
}
Example #7
Source File: clients.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectClients = () => {
return inject(provideClientsKey);
}
Example #8
Source File: register.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectRegister = () => {
return inject(provideRegisterKey);
}
Example #9
Source File: shareData.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectShareData = () => {
return inject(shareDataKey);
}
Example #10
Source File: websocket.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectWebsocket = () => {
return inject(provideWebsocketKey);
}
Example #11
Source File: list-share-data.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectFilesData = () => {
return inject(provideFilesDataKey);
}
Example #12
Source File: register.js From p2p-tunnel with GNU General Public License v2.0 | 5 votes |
injectRegister = () => {
return inject(provideRegisterKey);
}