Comments (7)
The same thing happens when assigning an identifier to a property with a model descriptor.
import { Model, ModelIdentifier, define, store } from "https://esm.sh/[email protected]"
export interface IModel {
prop1: number
}
export const ModelStore: Model<IModel> = {
id: true,
prop1: 1
}
function setModelById(host: IComponent, id: ModelIdentifier) {
host.model = id
}
export interface IComponent extends HTMLElement {
model: IModel
}
export default define<IComponent>({
tag: "a-component",
model: store(ModelStore, { draft: true }),
})
message:
Type 'ModelIdentifier' is not assignable to type 'IModel'.
Type 'undefined' is not assignable to type 'IModel'. ts(2322)
from hybrids.
I don't have time to check every TS error (from all of your issues) - can you confirm if the problem is solved by using TS v4
?
FYI: #236 (comment)
from hybrids.
Typescript version: 4.9.5 did not solve these problems. This seems to be untyped implicit logic.
from hybrids.
Update: In the first case, this is my mistake. I should have written not
function submit(host: IComponent) {
store.submit(host.draft)
host.draft = undefined
}
but
function submit(host: Component<IComponent>) {
store.submit(host.draft)
host.draft = undefined
}
But the error from the second case does not disappear even after this fix:
import { Model, define, store, Component } from "https://esm.sh/[email protected]"
export interface IModel {
id: number
prop1: number
}
export const ModelStore: Model<IModel> = {
id: true,
prop1: 1
}
function setModelById(host: Component<IComponent>, id: number) {
host.model = id
}
export interface IComponent extends HTMLElement {
model: IModel
}
export default define<IComponent>({
tag: "a-component",
model: store(ModelStore, { draft: true }),
})
from hybrids.
This "was" a limitation of the TS itself, that the setter must accept the same type as a getter. I am sure, it was like this when I created definitions for TS.
Your type says:
model: IModel
But you are trying to set it to a number
. As this is expected in hybrids, I am not sure if this is possible to define in TS.
EDIT: You can try with mode: IModel | number
, but then you are opening many conditions when using that property, as TS claims that it might be also a number
(which getting the value is not correct).
from hybrids.
Hid it in a helper function:
import { Model, define, store, Component } from "https://esm.sh/[email protected]"
function setModelDescriptorId<C extends Component<any>>(component: C, property: object) {
let [key, value] = Object.entries(property)[0]
/// @ts-ignore
component[key] = value
}
export interface IModel {
id: number
prop1: number
}
export const ModelStore: Model<IModel> = {
id: true,
prop1: 1
}
function setModelById(host: Component<IComponent>, id: number) {
setModelDescriptorId(host, { model: id })
}
export interface IComponent extends HTMLElement {
model: IModel
}
export default define<IComponent>({
tag: "a-component",
model: store(ModelStore, { draft: true }),
})
But my typescript skills were not enough to write correct generics for this helper function.
from hybrids.
This "was" a limitation of the TS itself, that the setter must accept the same type as a getter. I am sure, it was like this when I created definitions for TS.
Different getters and setters for interfaces are now available, but it is unclear how current types based on "mapped types" can be rewritten as interfaces.
There is currently no way to use access options in mapped types. There is an open feature request for this at microsoft/TypeScript#43826. It's marked as "Waiting for More Feedback" which means they want to hear more community feedback in favor of it before considering the possibility of its implementation.
Could you write a comment there saying that this feature is necessary?
from hybrids.
Related Issues (20)
- Using "store([Model])" causes a TypeScript error HOT 18
- "children" fabric causes TypeScript error HOT 4
- using 'host.render()' and 'host.content()' causes a TypeScript error HOT 4
- The "store(Model, { id: value })" descriptor does not resolve "id" correctly to the model instance. HOT 3
- The "store(Model, { id:value })" descriptor does not work correctly. HOT 2
- Add a helper for assigning component properties HOT 3
- Dynamic columns not showing when render a html table HOT 4
- '"hybrids"' has no exported member named 'property'. Did you mean 'Property'? HOT 8
- Add support for "TypeScript v5" HOT 3
- I can't create an arbitrary number of nested forms: HOT 6
- Small Type Inferencing Issue with Property<E, V> HOT 6
- Cannot pass an object to the API via the "list" method HOT 7
- version 8.2.17 backwards compatibility is broken! HOT 9
- Expand the functionality of drafts
- sync() with nested models is broken HOT 4
- Allow storing an object in a component property HOT 4
- Add partial loading of model data HOT 3
- Why do you remove the lastValue? HOT 2
- The store logs a lot of errors HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hybrids.