gpt4 book ai didi

javascript - 如何使用回调方法将数据插入 polymer 属性

转载 作者:行者123 更新时间:2023-12-03 05:40:32 26 4
gpt4 key购买 nike

我有一个 Polymer 页面,我正在尝试将新数据推送到我的 my_cart_items 属性。如果我在 ready() 中调用 this.AddNewGrocery("data"); ,它就会起作用;但是当我在 this.GetGroceryItem("null", "null", this.AddNewGrocery); 中将该函数作为回调传递时,我收到此错误:

Uncaught TypeError: this.push is not a function(…)

我认为错误与范围有关,所以我尝试像这样访问页面的本地 DOM:

//try 1 not working
Polymer.dom(this.root).querySelector('my-shopview').push('my_cart_items', new CartItem("null","null","Banana1","null","null","null","null"));

//try 2 not working
document.querySelector('my-shopview').push('my_cart_items', new CartItem("null","null","Banana1","null","null","null","null"));

我不知道还能做什么。谁能帮我解决这个问题吗?

class CartItem {
constructor(groceryId, groceryImgeUrl, groceryName, groceryOrigin, groceryDescription, grocerSaleDetails, groceryDealDetail, grocerySaleTags, produseTypeTag) {
this.groceryId = groceryId
this.groceryImgeUrl = groceryImgeUrl
this.groceryName = groceryName;
this.groceryOrigin = groceryOrigin;
this.groceryDescription = groceryDescription;
this.grocerSaleDetails = grocerSaleDetails;
this.groceryDealDetail = groceryDealDetail;
this.grocerySaleTags = grocerySaleTags;
this.produseTypeTag = produseTypeTag;
}
}
Polymer({
is: 'my-shopview',
properties: {
my_cart_items: {
type: Object,
value: function() {
return [];
}
}
},
// Query the database for data
GetGroceryItem: function(query, count, callback) {
var message = "null";
//query the database

//callback after we've received the data
if (callback && typeof callback == "function") {
return callback(message)
}
},
//Callback method to be called after GetGroceryItem has finished executing
AddNewGrocery: function(post) {
//Working when function is called not as a callback method
this.push('my_cart_items', new CartItem("null", "null", "Banana1", "null", "null", "null", "null"));
//Try 1 not Working
//Polymer.dom(this.root).querySelector('my-shopview').push('my_cart_items', new CartItem("null","null","Banana1","null","null","null","null"));
//Try 2 not Working
//document.querySelector('my-shopview').push('my_cart_items', new CartItem("null","null","Banana1","null","null","null","null"));
},
//After local dom has been initiized
ready: function() {
//Populate my cart items with data from firebase
this.push('my_cart_items', new CartItem("null", "null", "Banana2", "null", "null", "null", "null"));
this.push('my_cart_items', new CartItem("null", "null", "Banana3", "null", "null", "null", "null"));
//Get the grocery item's and invove the AddNewGrocery callback method
this.GetGroceryItem("null", "null", this.AddNewGrocery);
}
});

这是我对其他两种方法的堆栈跟踪:

my-shopview.html:125 Uncaught TypeError: Cannot read property 'push' of null(…)
AddNewGrocery @ my-shopview.html:125
GetGroceryItem @ my-shopview.html:115
ready @ my-shopview.html:133
...

最佳答案

问题是您正在调用需要 this 的回调要定义(具体来说, this 应该与 GetGroceryItem() 相同的 Polymer 对象),在这种情况下,您应该使用 Function.prototype.call(this, ...) :

callback.call(this, message);

HTMLImports.whenReady(function() {
Polymer({
is: 'my-shopview',
properties: {
my_cart_items: {
type: Object,
value: function() {
return [];
}
}
},

GetGroceryItem: function(query, count, callback) {
var message = "null";

if (callback && typeof callback == "function") {
return callback.call(this, message);
}
},

AddNewGrocery: function(post) {
this.push('my_cart_items', 'Banana1');
},

ready: function() {
this.push('my_cart_items', 'Banana2');
this.push('my_cart_items', 'Banana3');
this.GetGroceryItem("null", "null", this.AddNewGrocery);
}
});
});
<head>
<base href="https://polygit.org/polymer+1.7.0/components/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="polymer/polymer.html">
</head>
<body>
<my-shopview></my-shopview>

<dom-module id="my-shopview">
<template>
<template is="dom-repeat" items="[[my_cart_items]]">
<div>[[item]]</div>
</template>
</template>
</dom-module>
</body>

codepen

关于javascript - 如何使用回调方法将数据插入 polymer 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40554409/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com