__vueParentComponent
.:)this.$parent
для родительского компонента или ты можешь использовать ref для выбора конкретного. props
из родителя и не городи огород.getFormattedData
тоже должен быть дженерик и собсно его(дженерик) прокидывать в нижестоящие.type Type1 = 1;
type Type2 = 2;
type Type3 = 3;
type ContainsType<T extends UniversalType = UniversalType> = {type: T};
type UniversalType = Type1 | Type2 | Type3;
class Cls {
async getFormattedData<T extends UniversalType>(data: ContainsType<T>): Promise<T> {
const anyDataObject = this.validateData(data);
const result = this.formatDataByType(anyDataObject);
return result;
}
validateData<T extends UniversalType = UniversalType>(data: ContainsType<T>): T {
return data.type
}
formatDataByType<T extends UniversalType = UniversalType>(data: T): T {
return data
}
}
const foo = await new Cls().getFormattedData({type: 2}); // 2
const anyDataObject: Type1 | Type2 | Type3 = ...
if (anyDataObject === 2) {
// тут anyDataObject для ts считается Type2
}
но это уже никак не повлияет на выходной тип.Math.random()
. input
нет свойства length
.var intxt=document.querySelector('input').length;
intxt === undefined
console.log
вообще-то должен был тебе это показать.if(intxt.length<5){
тут ты пытаешься получить свойство length
у unefined
о чем тебе и пишет ошибка.var intxt=document.querySelector('input');
....
if(intxt.value.length<5){
....
} else {
import img from './assets/img.jpeg'
public
и брать их как есть по прямым путям относительно корня без всяких хэшей.interface MutableRefObject<T> {
prev: null | HTMLParagraphElement;
}
declare module 'lib-name' {
interface MutableRefObject<T> {
prev: null | HTMLParagraphElement;
}
}
declare module 'lib-name/full/path/to/declaration.ts' {
interface MutableRefObject<T> {
prev: null | HTMLParagraphElement;
}
}
interface MySuperMutableRefObject extends MutableRefObject<T> {
prev?: null | HTMLParagraphElement;
}
async function multiStep() {
await step1();
if (stop) throw new Error(stop);
await step2();
if (stop) throw new Error(stop);
await step3();
if (stop) throw new Error(stop);
}
и никак красивее не сделать. function* multiStep() {
yield step1();
yield step2();
yield step3();
}
Ctrl++
. Если ты хочешь тупо такое же масштабирование, то не надо*. import { ref, h } from 'vue';
function loadScript(options, root = document.head) {
return root.appendChild(Object.assign(document.createElement('script'), options));
}
const Comp = defineComponent(() => {
const root = ref(null);
onMounted(() => {
loadScript(
{
innerHTML: `
!(function (a, m, o, c, r, m) {
(a[o + c] = a[o + c] || {
setMeta: function (p) {
this.params = (this.params || []).concat([p]);
},
}),
(a[o + r] =
a[o + r] ||
function (f) {
a[o + r].f = (a[o + r].f || []).concat([f]);
}),
a[o + r]({
id: "....",
hash: "....",
locale: "ru",
}),
(a[o + m] =
a[o + m] ||
function (f, k) {
a[o + m].f = (a[o + m].f || []).concat([[f, k]]);
});
})(window, 0, "amo_forms_", "params", "load", "loaded");
`
},
root.value
);
loadScript(
{
id: 'amoforms_script_...',
async: 'async',
charset: 'utf-8',
src: 'https://forms.amocrm.ru/forms/assets/js/amoforms.js?...'
},
root.value
);
});
return () => h('div', { ref: root });
});
useMemo
нужен, чтобы при передаче значения как prop
в низлежащий memo
компонент не происходила перерисовка оного если не было изменений(+при передаче как зависимость в другой хук, тот не срабатывал заново).useMemo
и пойдёт водопадом перерисовка на каждый чих каждого компонента по всему дереву вниз. И именно это является основной причиной тормозов в React, а не какие-то там мифические сложные вычисления.useMemo
"только в узких местах" и нигде больше. Прикол в том, что с таким подходом при разрастании проекта никакого "узкого места" просто нет, тормозить начинает просто потому, что складываются тысячи микротормозов от тысяч перерисовок тысяч компонентов: наступает то самое "потом" и тут придётся переписывать с useMemo
чуть ли не весь проект, чтоб снизить эти тормоза.useMemo
стараются таки использовать заранее в каждом месте, где оно потенциально нужно. Некоторые радикальные философии вообще предполагают использование useMemo
просто всегда, без исключений.:) script type="module
" через import
(никаких глобальных вызовов)./browse
.<script type="importmap">
{
"imports": {
"tictic": "https://unpkg.com/tictic@0.1.0/esm/index.js",
"tslib": "https://unpkg.com/tslib@2.6.2/tslib.es6.js"
}
}
</script>
<script type="module">
import { getDate } from 'tictic';
console.log(getDate({}));
</script>
[role="row"]:has(.fraud) {
background-color: #f1f7bc;
}
[role="row"] {
position: relative;
background-color: transparent;
}
[role="row"] .fraud::before {
content: "";
display: block;
position: absolute;
z-index: -1;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: #f1f7bc;
}
MutationObserver
и следить за появлением новых [role="row"]
.