Skip to content

Instantly share code, notes, and snippets.

View ABooooo's full-sized avatar

ABooooo

0 followers · 1 following
View GitHub Profile
@ABooooo
ABooooo / template refs
Created June 19, 2024 11:54
/* for example get el width */
// template
<p ref="appTitleRef">App title</p>
// script
const appTitleRef = ref(null)
onMounted(() => {
console.log(`The app title is ${ appTitleRef.value.offsetWidth } px wide`)
@ABooooo
ABooooo / lists v-for
Created June 19, 2024 11:53
// script
const posts = ref([
{
id: 1,
title: 'post 1'
},
{
id: 2,
title: 'post 2'
}
@ABooooo
ABooooo / Computed Properties
Created June 19, 2024 11:50
/*
Computed properties are properties which are usually generated based on reactive data which are cached and only update when dependencies change.
*/
<template>
<p>{{ data.number }}</p>
<p>This number is {{ oddOrEven }}</p>
<button @click="newNumber(5)">Set the number<button/>
</template>
@ABooooo
ABooooo / Two-Way Data Binding
Last active June 19, 2024 11:48
<template>
<h1>{{ title }}</h1>
<p>Edit title: </p>
<input v-model="title" type="text"/>
</template>
<script setup>
import { ref } from 'vue'
@ABooooo
ABooooo / Refs
Last active June 19, 2024 11:46
<template>
<p>{{ text }}</p>
</template>
<script setup>
import { ref } from 'vue'
const text = ref('juhu')
</script>
@ABooooo
ABooooo / create nested json from html
Created April 24, 2024 09:01
$('#saveNewTasklist').on("click", function () {
const nestedQuery = '.nested-sortable';
const identifier = 'taskId';
const root = document.getElementById('tasks');
function serialize(tasks) {
var serialized = [];
var children = [].slice.call(tasks.children); // children == document property
/**
* [].slice.call() == Array.prototype.slice.call()
*
@ABooooo
ABooooo / get Url
Last active March 31, 2023 05:21
var overviewPageUrl = '@Model.Content.Url';
var overviewPageUrl = '@Model.Content.Parent.Url';
var detailPageUrl = '@Model.Content.Children.SingleOrDefault(node => node.DocumentTypeAlias == "MDArticleLocalDetailPage").Url';
@ABooooo
ABooooo / add custom hook
Created May 6, 2022 06:59
// place in template
do_action( 'tuttner_show_payment_options' );
// place in functions.php
add_action( 'tuttner_show_payment_options', 'woocommerce_checkout_payment', 20 );
// this example is for custom placing a payment options
@ABooooo
ABooooo / custom product loop
Created March 25, 2022 12:39
<?php
$args = array(
'post_type' => 'product',
'product_cat' => 'klaviere',
'posts_per_page' => 3,
'orderby' => 'date',
'order' => 'DESC'
);
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post();
@ABooooo
ABooooo / Passing data with service
Last active February 21, 2022 20:52
// model
// ts
export interface Post {
// some data for example
title: string;
content: string;
}
// service
// ts