Skip to content

Instantly share code, notes, and snippets.

Avatar

Thorsten Lünborg LinusBorg

View GitHub Profile
View promisify-file-reader.js
function promisifyFileReader (filereader) {
function composeAsync (key) {
return function () {
var args = arguments
return new Promise (function (resolve, reject) {
//
function resolveHandler () {
cleanHandlers()
resolve(filereader.result)
}
@LinusBorg
LinusBorg / reset.js
Created Oct 16, 2016
$reset() instance method for Vue
View reset.js
/*
* Add this before you create your Vue instance with new Vue(...)
*/
Vue.prototype.$reset = function () {
var data = this.$options.data()
Object.keys(data).map(key => {
this[key] = data[key]
})
}
@LinusBorg
LinusBorg / TestinVSCode.md
Created May 2, 2018
Testing Vue apps in VS Code
View TestinVSCode.md
View Demo.vue
<template>
<div>
yy
</div>
</template>
<script>
export default {
methods: {
async hello() {
@LinusBorg
LinusBorg / chunksPlugin.js
Last active Mar 3, 2019
Adding a local plugin to a Vue CLI preset
View chunksPlugin.js
// Local Plugin:
// https://cli.vuejs.org/guide/plugins-and-presets.html#project-local-plugin
// See also:
// https://cli.vuejs.org/dev-guide/plugin-dev.html#modifying-webpack-config
module.exports = api => {
const webpack = require('webpack')
api.configureWebpack({
plugins: [
@LinusBorg
LinusBorg / Presenter.vue
Last active Jun 15, 2019
Pseudocode example for a reddit discussion about the proposed Vue 3 composition RFC
View Presenter.vue
<template>
<!-- eslint-disable -->
<spinner v-if="showSpinner"></spinner>
<presentation-player v-else :page-data="$store.state.presentationPageData"></presentation-player>
</template>
<script>
/* eslint-disable */
import webSocketService from 'services/websocket'
import { usePresentation } from './base'
@LinusBorg
LinusBorg / Form.vue
Last active Jun 24, 2019
Consuming function-based plugin in object-based Vue component
View Form.vue
<template>
<form>
<input type="text" v-model="data.name" />
<span v-if="errors.name">{errors.name.msg{</span>
<span v-else>{{capsName}}</span>
<input type="number" v-model.number="data.age" />
<span v-if="errors.age">{errors.age.msg{</span>
</form>
</template>
@LinusBorg
LinusBorg / Masonry.vue
Last active Jun 24, 2019
Example of proposed Vue setup method
View Masonry.vue
<template>
<div ref="container">
<transition-group name="flip">
<div
v-for="item in gridItems"
:key="item.key"
:style="{ backgroundImage: item.css, height: item.height }"
/>
</transition-group>
</div>
@LinusBorg
LinusBorg / module.js
Last active Mar 9, 2020
Compiler Module for vue-loader to remove data-test attributes
View module.js
/*
*
* Usage:
* compilerModules: [
* createDataAttributeRemover(['test', 'test-data'])
* ]
*
*/
function createDataAttributeRemover(attributes = []) {
return {
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions