Skip to content

Instantly share code, notes, and snippets.

View vue-pagination-tutorial-3_App.vue
<template>
<div id="app">
<div class="content">
<ol>
<li v-for="(item, i) in filterItems" :key="i">{{item}}</li>
</ol>
</div>
<prev-next :page="page" :totalPage="totalPage" @change="onPageChange"/>
</div>
</template>
View vue-pagination-tutorial-3_prev-next.vue
<template>
<div class="pagination">
<a
:href="`?page=${prevPage}`"
class="prev"
v-if="currentPage > 1"
@click.prevent="onPrev"
>&lt; 前へ</a>
<div class="total">ページ {{currentPage}}/{{totalPage}}</div>
<a
View vue-pagination-tutorial-2.vue
<template>
<div id="app">
<div class="content">
<ol>
<li v-for="(item, i) in items" :key="i">{{item}}</li>
</ol>
</div>
</div>
</template>
@Tenderfeel
Tenderfeel / vue-pagination-tutorial-1.vue
Created Mar 24, 2019
[Vue] ページングコンポーネントの作り方とか 1
View vue-pagination-tutorial-1.vue
<template>
<div id="app">
</div>
</template>
<script>
export default {
name: "App",
components: {},
};
@Tenderfeel
Tenderfeel / nuxt-child-keep-alive-sample.vue
Last active Feb 21, 2019
nuxt-childでkeep-aliveを有効にした時にdataを保持する
View nuxt-child-keep-alive-sample.vue
<template>
<div>
<p>{{id}}</p>
<div>{{profile}}</div>
</div>
</template>
<script>
let cacheData = null;
export default {
name: 'user-index',
@Tenderfeel
Tenderfeel / CustomDie.php
Last active Sep 28, 2018
味気ないwp_dieの出力を変更する
View CustomDie.php
<?php
/**
* 味気ないwp_dieの出力を変更する
*/
class CustomDie {
public function __cosntruct() {
}
public function enable_custom_die() {
View modal-focus.js
// モーダル開閉時のフォーカス操作(モーダルのルート要素にtabindex=0必要)
$('.uk-modal').on('show', (e) => {
$(e.target).data('lastFocusdElement', window.document.activeElement).focus();
}).on('hide', (e) => {
$(e.target).data('lastFocusdElement').focus();
});
@Tenderfeel
Tenderfeel / responsive.scss
Created Sep 12, 2018
Sass Responsive Mixins
View responsive.scss
@function percentage-vw($num) {
$per: ($num * 100);
@return #{$per}vw;
}
@mixin responsive-width($width, $base: 750px) {
width: percentage($width / $base);
max-width: $width;
}
@Tenderfeel
Tenderfeel / wp-remove-all-rest-endpoint.php
Created Sep 12, 2018
Turn off Wordpress's default endpoint.
View wp-remove-all-rest-endpoint.php
add_filter( 'rest_endpoints', function( $endpoints ){
if ( isset( $endpoints['/wp/v2/posts'] ) ) {
unset( $endpoints['/wp/v2'] );
}
if ( isset( $endpoints['/wp/v2/posts'] ) ) {
unset( $endpoints['/wp/v2/posts'] );
}
if ( isset( $endpoints['/wp/v2/posts'] ) ) {
unset( $endpoints['/wp/v2/posts'] );
}
@Tenderfeel
Tenderfeel / countdown.js
Last active Sep 4, 2018
Countdown Timer
View countdown.js
class Countdown {
constructor() {
this.limit = new Date(META.limitdate);
this.labels = ['days', 'hours', 'minutes', 'seconds'];
this.elements = {};
this.nums = {};
this.onStop = () => {};
this.labels.forEach((label) => {
this.elements[label] = window.document.querySelector(`.countdown > .nums.${label}`);
You can’t perform that action at this time.