immediate: true
, и, так как он задан на самом компоненте, вызван он будет сразу перед хуком created
, когда vue-компонент уже создан но ещё не примонтирован. Соответственен никакого canvas
на странице в этот момент нет. mounted
через this.$watch
. let a1 = {
channelID: {
RegExp: ["\\d+", true],
description: "d1"
},
content: {
RegExp: [".+", true],
description: "d2"
}
};
type T1 = {[K in keyof typeof a1]: string}
type Args = {
[key: string]: {
RegExp: [string, boolean],
description: string
}
}
function createArgs<T extends Args>(args: T): T {
return args;
}
type TStringKeys<T extends Args> = {[K in keyof T]: string};
let a1 = createArgs({
channelID: {
RegExp: ["\\d+", true],
description: "d1"
},
content: {
RegExp: [".+", true],
description: "d2"
}
});
type T1 = TStringKeys<typeof a1>
К сожалению на текущий момент(ts4.2.3) избавиться от функции-обёртки не получится. props
в свойствах маршрута может быть функцией. В эту функцию вы можете добавить как свой валидатор, так и приведение типов. interface IOrder {
date: string,
docTypesName: string,
docId: number,
image: string,
name: string,
price: number,
quantity: number,
removed: number,
}
interface IProduct {
image: string,
name: string,
price: number,
quantity: number,
}
interface IDocument {
date: string,
docId: number,
docTypesName: string,
products: IProduct[],
}
interface IElement {
date: string,
documents: IDocument[]
}
interface IElementMap {
date: string,
documents: Record<string, IDocument>
}
type IResultMap = Record<string, IElementMap>;
function f(orders: IOrder[]): IElement[] {
const result = orders.reduce((accumulator, currentValue) => {
const date = currentValue.date.split(' ')[0];
if (!accumulator[date]) {
accumulator[date] = {
date,
documents: {},
}
}
if (!accumulator[date].documents[currentValue.docTypesName]) {
accumulator[date].documents[currentValue.docTypesName] = {
date: currentValue.date,
docId: currentValue.docId,
docTypesName: currentValue.docTypesName,
products: [],
}
}
accumulator[date].documents[currentValue.docTypesName].products.push({
name: currentValue.name,
price: currentValue.price,
image: currentValue.image,
quantity: currentValue.quantity,
})
return accumulator;
}, {} as IResultMap)
console.log('result', result);
return Object.values(result).map(currentValue => {
console.log('currentValue', currentValue);
return {
...currentValue,
documents: Object.values(currentValue.documents)
}
});
}
console.log(f(orders));
firstChild
и что там у него со scrollHeight
. Не знаете, говорю, даже если сами тот компонент написали. Это основа компонентного подхода: содержимое любого компонента может быть полностью переписано без влияния на зависимые от него родительские компоненты. Любое управление осуществляется через props
, события (и, в особых случаях, докуметированные публичные методы и свойства, получаемые через ref
). set-height-by-child
, которое и будет управлять данным поведением, либо, если нужна работа с этой высотой снаружи, посылать из него событие вроде @emit('scroll-height-changed', scrollHeight)
при mounted
, при изменении размера экрана и прочих возможных случаях. {
infoBlock: [{
type: 'text',
value: '...'
},{
type: 'component',
value: 'review'
},{
type: 'text',
value: '...'
}]
}
а уже SPA разложит это всё на готовую разметку.