ktyr report

JavaScript

[Shopify]Checkout UI Extensionで設定項目の値を取得

2024-10-01

const { banner_status } = useSettings();

[JavaScript]useAppMetafields

2024-08-01

let j,productId;
const cartLines = useCartLines();
const appMetafields = useAppMetafields();
if(appMetafields.length){
  cartLines.forEach((cartLine,i)=>{
    productId = cartLine.merchandise.product.id.split("/").pop();
    for(j=0;j<appMetafields.length;j++){
      if(appMetafields[j].target.id === productId){
        if(appMetafields[j].metafield.key === "metafieldKey" && appMetafields[j].metafield.value === "metafieldValue"){
          //処理
        }
        break;
      }
    }
  });
}

[JavaScript]オプショナルチェーン備忘録

JavaScript

2024-07-01

1

const tmp = {name:"abc"};
console.log(tmp.address?.length);

undefined

2

const tmp = {name:"abc"};
console.log(tmp.address?.length+tmp.city?.length);

NaN

3

const tmp = {name:"abc"};
console.log(tmp.address?.length+tmp.city?.length > 4);

false

4

const tmp = {name:"abc"};
console.log(tmp.address?.length+tmp.city?.length == 0);

false

5

const tmp = {name:""};
console.log(tmp.name?.length+tmp.city?.length <= 1);

false

6

const tmp = {name:""};
console.log(tmp.name?.length <= 1);

true

[JavaScript]指定要素の指定イベント発火

JavaScript

2024-04-01

triggerEvent(element, eventName){
    const evt = new CustomEvent(eventName, {bubbles:true,cancelable:true});
    return element.dispatchEvent(evt);
}

[JavaScript]ブラウザバック判定

JavaScript

2024-03-01

isBrowserBack(){
    const perfEntries = performance.getEntriesByType("navigation");
    let result = false;
    perfEntries.forEach((perfEntry) => {
        if(perfEntry.type == 'back_forward'){
            result = true;
        }
    });
    return result;
}

[JavaScript]Promise

JavaScript

2024-02-01

getCart(){
    return new Promise((resolve,reject) => {
        const url = 'url';
        fetch(url)
            .then((response)=>{
                if (!response.ok) {
                    throw new Error();
                }
                return response.json();
            })
            .then((json)=>{
                resolve(json);
            })
            .catch((error)=>{
                reject(error);
            });
    });
}

this.getCart()
.then((json)=>{
    
})
.catch((error)=>{

});

[JavaScript]break

JavaScript

2024-01-01

loop: for(i=0;i<10;i++){
    for(key in item.properties){
        if(key === 'break'){
            break loop;
        }
    }
}

[JavaScript]文字列から漢字抽出

JavaScript

2023-12-01

文字列から漢字抽出

const str = 'ひらがな小林カタカナ漢字';
const pattern = /(\p{scx=Han}+)/ug;
const matches = str.match(pattern);
console.log(matches);

出力

(2) ['小林', '漢字']

[JavaScript]ShopifyCartAPIを叩く(update.js)

2023-02-01

let sendData = {
    updates : {}
};
this.deleteItems.forEach((item,index)=>{
    sendData.updates[item.key] = 0;
});
let options = {
    method  : 'POST',
    credentials: 'same-origin',
    headers : {
        'Content-Type': 'application/json'
    },
    body    : JSON.stringify(sendData)
};
fetch(window.Shopify.routes.root+'cart/update.js',options)
.then((response)=>{
    if (!response.ok) {
        throw new Error();
    }
    return response.json;
})
.then((json)=>{
    this.finishFetch(2);
})
.catch((error)=>{
    console.log(error);
});

[JavaScript]ShopifyCartAPIを叩く(change.js)

2023-01-02

let sendData = {
    id         : item.key,
    quantity   : item.quantity,
    properties : {}
};
item.properties.forEach((property,index)=>{
    sendData.properties['プロパティ'+(index+1)] = property.value;
});
let options = {
    method       : 'POST',
    credentials  : 'same-origin',
    headers : {
        'Content-Type' : 'application/json'
    },
    body         : JSON.stringify(sendData)
};
fetch(window.Shopify.routes.root+'cart/change.js',options)
.then((response)=>{
    if (!response.ok) {
        throw new Error();
    }
    return response.json;
})
.then((json)=>{
    this.finishFetch();
})
.catch((error)=>{
    console.log(error);
});