У меня проблема с обновлением визуальных элементов на полимерной странице.Мой элемент выглядит следующим образом:
import { html, LitElement, property } from 'lit-element';
import { connect } from 'pwa-helpers/connect-mixin.js';
// These are the shared styles needed by this element.
import { SharedStyles } from '../../styles/shared-styles.js';
// This element is connected to the Redux store.
import { store, RootState } from '../../store.js';
class TFJSItem extends connect(store)(LitElement) {
@property({type: Number})
private _prediction = 0;
static styles = SharedStyles;
protected render() {
console.log(this._prediction);
return html`
<section>
<h2>TFJS</h2>
<p>${this._prediction}</p>
</section>
`;
}
// This is called every time something is updated in the store.
stateChanged(state: RootState) {
console.log(state.network!.prediction);
this._prediction = state.network!.prediction;
}
}
window.customElements.define('tfjs-item', TFJSItem);
У меня есть скрипт, работающий на 1000 итераций, который отправляет действие в redux для обновления числа, хранящегося в network.prediction
.Однако число, отображаемое в элементах, обновляется только один раз после последнего изменения состояния.Так как я хочу, чтобы это был живой номер, я хочу, чтобы каждое изменение было записано.Самое странное, что второе console.log()
выполняется для каждого изменения, однако, рендеринг вызывается только один раз.
Данные поступают из процесса обучения tfjs.Я хочу обновлять прогноз каждый раз, когда была сделана новая итерация:
import * as tf from '@tensorflow/tfjs';
import * as d from './data';
import * as m from './model';
import { store } from '../store.js';
import { newPrediction } from '../actions/network.js';
export class Training {
model: m.Model;
data: d.Data;
iterations: number;
constructor(model: m.Model, data: d.Data) {
this.model = model;
this.model.model.compile({loss: 'meanSquaredError', optimizer: 'sgd'});
this.data = data;
this.iterations = 0;
}
start() {
var this_ = this;
if (this.iterations < 1000) {
this.iterate();
}
}
iterate() {
this.iterations++;
tf.tidy(() => {
const prediction = this.model.model.predict(tf.tensor2d([5], [1, 1]) as tf.Tensor) as tf.Tensor<tf.Rank>;
store.dispatch(newPrediction(prediction));
this.model.model.trainOnBatch(this.data.xs, this.data.ys);
});
}
}