【速記】どのように一行のコードを使って、ラクダのピークスタイルの文字列を中線スタイルの文字列に変換しますか?
1824 ワード
起源
今日は
コードの位置が見つかりました
ファイル
今日は
snabbdom
(Virtual DOMライブラリ)の処理要素のカスタム属性について読みましたが、ラクダのピークスタイルの文字列を中線スタイルの文字列に変換する技術が発見されました.datasetによって実際のDOM要素に対応するatributeを除去することができます.DOMオブジェクトのdatasetとHTMLカスタム属性の対応規則は、こちらの文書を読んでもいいです.https://developer.mozilla.org... コードの位置が見つかりました
ファイル
src/modules/dataset.ts
import {VNode, VNodeData} from '../vnode';
import {Module} from './module';
export type Dataset = Record;
const CAPS_REGEX = /[A-Z]/g; //
function updateDataset(oldVnode: VNode, vnode: VNode): void {
let elm: HTMLElement = vnode.elm as HTMLElement,
oldDataset = (oldVnode.data as VNodeData).dataset,
dataset = (vnode.data as VNodeData).dataset,
key: string;
if (!oldDataset && !dataset) return;
if (oldDataset === dataset) return;
oldDataset = oldDataset || {};
dataset = dataset || {};
const d = elm.dataset;
for (key in oldDataset) {
if (!dataset[key]) {
if (d) {
if (key in d) {
delete d[key];
}
} else {
elm.removeAttribute('data-' + key.replace(CAPS_REGEX, '-$&').toLowerCase());
}
}
}
for (key in dataset) {
if (oldDataset[key] !== dataset[key]) {
if (d) {
d[key] = dataset[key];
} else {
elm.setAttribute('data-' + key.replace(CAPS_REGEX, '-$&').toLowerCase(), dataset[key]);
}
}
}
}
export const datasetModule = {create: updateDataset, update: updateDataset} as Module;
export default datasetModule;
コードのサンプル"theStringYouWanToChange".replace(/[A-Z]/g,'-$&').toLowerCase();
実行結果"the-string-you-wan-to-change"
関連文書String.prototype.replace()
:https://developer.mozilla.org...