-
Notifications
You must be signed in to change notification settings - Fork 142
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Adapting firestore-mixin for lit-element #355
Comments
You can try including the mixin in your firestore-mixin implementation. lit-element handles the properties element quite differently from what you might be used from polymer-element though. |
After much tinkering, I was able to make it work. Any suggestions on how I can improve my solution will be greatly appreciated. Here's the updated code: //firestore-mixin.js
_firestoreBind(name, options) {
const defaults = {
live: false,
observes: [],
}
const parsedPath = parsePath(options.doc || options.collection);
const config = Object.assign({}, defaults, options, parsedPath);
const type = config.type =
config.doc ? 'doc' : config.collection ? 'collection' : undefined;
this._firestoreProps[name] = config;
const args = config.props.concat(config.observes);
if (args.length > 0) {
//Updated code
//-----------------------------------------------------------
this.argsObject = {
args: args,
name: name
};
//-----------------------------------------------------------
} else {
this._firestoreUpdateBinding(name, ...args.map(x => this[x]));
}
}
//end firestore-mixin.js
//my-element.js
static get properties() {
return {
pid: String,
patient: {
type: Object,
doc: 'patients/{pid}',
live: true
},
argsObject: Object
}
}
_shouldRender(props, changedProps, prevProps) {
console.log('should render:', changedProps);
if(changedProps && changedProps.pid && this.argsObject) {
var argsArr = props.argsObject.args;
this._firestoreUpdateBinding(props.argsObject.name, ...argsArr.map(x => this[x]))
}
return true;
}
//end my-element.js What I'm doing is manually setting the argsObject, which is declared in my-element. This object has the name and args properties, which are needed to call _firestoreUpdateBinding. I then added the _shouldRender method, which calls the _firestoreUpdateBinding method whenever the pid property changes. It also has some extra checks to prevent errors, such as a null check for the changedProps object and a null check for the argsObject. |
Description
I'm currently trying to integrate firestore-mixin into my project, and I've come across a couple of errors. For example, when the mixin tries to call this.splice it throws. I fixed that particular error by replacing this.splice with Arrray.splice, and it seems have worked...although I can't say if that's the best solution. The most recent error I've encountered is one I can't figure out how to fix, so I'm hoping I can get some suggestions here. The mixin throws when it tries to call this._createMethodObserver. Here's the relevant code, including the document I'm trying to access. I also attached a screenshot of the error.
I tried simply removing the call, but the patient property remains undefined. Any suggestions would be greatly appreciated!
Browsers Affected
The text was updated successfully, but these errors were encountered: