我是Rxjs的新手我正在尝试理解下面的BehaviourSubject是我的代码
export interface State {
items: Items[]
}
const defaultState = {
items: []
};
const _store = new BehaviorSubject<State>(defaultState);
@Injectable()
export class Store {
private _store = _store;
changes = this._store.distinctUntilChanged()
.do(() => console.log('changes'));
setState(state: State) {
this._store.next(state);
}
getState() : State {
return this._store.value;
}
purge() {
this._store.next(defaultState);
}
}
Run Code Online (Sandbox Code Playgroud)
当我运行我的项目时,我在我的控制台中收到此错误
platform-browser.umd.js:1900 EXCEPTION: Error: Uncaught (in promise):
EXCEPTION: Error during instantiation of Store! (StoreHelper -> Store).
ORIGINAL EXCEPTION: TypeError: this._store.distinctUntilChanged is not a function
Run Code Online (Sandbox Code Playgroud)
谁能帮我吗.此外,如果我想要做的是为我的模型对象创建一个商店,所以如果有任何其他更简单的方式随时建议它.
任何帮助表示赞赏.
我有简单的节点服务器(nodejs + express + ejs渲染),当用户试图加载特定的页面服务器发送编译的html并发送响应时.
为了跟踪用户,我添加了2个计数器
一个.计数器,当服务器收到该页面的请求时递增
湾 当客户端加载页面时,它包含一些代码,这些代码会将HTTP请求发送回我用作计数器的服务器
现在的问题是,随着时间的推移上的区别sentResponse
柜台和clientLoad
柜台的增大而增大,以至于我得到sentResponse = 7000
和clientLoad = 3600
.
关于什么可能导致这种行为的任何建议
注意:在请求到达我的服务器之前我也设置了Cloudfare并且我暂停了它但是我仍然遇到了巨大的差异?
注意:我也注意到很多用户经常在4s以下多次向页面发出请求,但我确信我发送的是有效的html而且我的差异几乎是50%所以我不认为每个访问该页面的用户都是在4s下按ctrl + r 2次或更多次.
码:
server.js
app.get('/dashboard', (res, res) => {
...
...
...
Tracker.incrementCount('sentResponse');
res.render(page.ejs, {...});
});
app.get('/client-load-start', (req, res) => {
Tracker.incrementCount('clientLoadStart');
res.send(200);
});
Run Code Online (Sandbox Code Playgroud)
page.ejs
<html>
<head>
...
<script src='/client-load-start?version=<some_random_4_digit_number>'></script>
...
</head>
<body>
...
...
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我有一个显示用户列表的基本组件,当安装组件时,我使用useEffect
API 调用来加载数据,而在加载数据时,我想在 UI 中显示加载程序。
我的理解是,loader 标志应该保留在 React 组件的状态中,因为它代表该组件的状态,而不是在 redux 存储中,因为 redux 存储代表/保存整个应用程序的状态,例如登录的用户、用户列表等,而不是每个应用程序反应组件的可能状态,从应用程序架构的角度来看,这种想法是错误的还是不正确的?
我的推理是,如果我们要在 redux 存储中存储加载标志,那么为什么要费心使用 React 组件的状态而不只是使用 redux 存储呢?
如果不是,那么实现这一目标的最简单方法是什么?
反应组件
function List(props) {
const [loading, setLoading] = useState(false);
const reduxData = useSelector((store) => {
return {
users: store.users.list,
};
});
useEffect(() => {
//show loader
setLoading(true);
//wait until data is loaded
props.requestRequests();
// hide loader
setLoading(false);
}, []);
if (loading) {
return (
<Loader />
)
}
return (
<Table users={reduxData.users} />
); …
Run Code Online (Sandbox Code Playgroud) Widget build(context) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
width: 300,
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: color ?? Colors.blue,
borderRadius: BorderRadius.circular(10)
),
child: msg
)
],
);
}
Run Code Online (Sandbox Code Playgroud)
这是我的小部件的构建方法,它根据我作为msg
参数传递的内容来呈现此UI
现在我面临的问题是我无法在不设置宽度的情况下将文本包装在此容器/蓝色框中,但是如果我设置了容器/蓝色框的宽度,那么无论文本有多短,它将始终保持该宽度。
现在有一种方法可以设置容器/蓝盒的maxWidth(比如说500)?这样蓝框将变得像“ Loading”之类的小文本一样宽,而长文本则可以扩展到达到500个单位的宽度,然后包装文本?
长文本的必需输出:
user-interface word-wrap flutter flutter-layout flutter-container
我正在创建一个 PWA,我想在更新的 Service Worker 可用时提示用户,但无论我是打电话skipWaiting()
还是skipWaiting
在开发控制台中手动按下,它都会陷入等待阶段。
只有当我首先停止现有的 Service Worker 时,才会安装新的 Service Worker。
我也尝试通过self.skipWaiting()
在安装阶段直接调用来强制安装,但我更新后的 Service Worker 仍然陷入等待阶段。
这是我的设置。
sw.js
// when installing hydrate caches and notify user that reload if required (if any)
self.addEventListener('install', async () => {
// self.skipWaiting();
await hydrateCache();
});
self.addEventListener('message', (message) => {
if (message.data === 'skipWaiting') {
debugger;
self.skipWaiting();
}
});
Run Code Online (Sandbox Code Playgroud)
索引.html
navigator.serviceWorker.register('sw.js')
.then(function (reg) {
reg.onupdatefound = function() {
var newServiceWorker = reg.installing;
if (reg.waiting && confirm('Updates are available, Would …
Run Code Online (Sandbox Code Playgroud) updating reactjs service-worker progressive-web-apps workbox
javascript ×2
reactjs ×2
angular ×1
browser ×1
express ×1
flutter ×1
node.js ×1
redux ×1
redux-saga ×1
rxjs ×1
typescript ×1
updating ×1
word-wrap ×1
workbox ×1