正在尝试使用vaadin路由器和web组件创建单页应用程序。一切都可以正常导航。但是,当在地址栏中键入有效地址时,我会在屏幕上得到以下输出,并且控制台中没有错误。
无法获取/删除用户
我已经回顾了这个问题,但似乎没有帮助:vaadin路由器:将参数路由到地址栏不起作用
我是否认为我应该能够键入地址并导航到资源?
教程中的典型设置:具有以下版本:
package.json
"name": "rollup-dependencies",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@rollup/plugin-node-resolve": "^13.0.0",
"rollup": "^2.52.8"
},
"dependencies": {
"@vaadin/router": "^1.7.4",
"lit-html": "^1.4.1",
"redux": "^4.1.0"
}
}
app.js-路线
import "../views/HomeView.js";
import "../views/NotFoundView.js";
import "../views/UserListView.js";
// select the DOM node where the router inserts route Web Components
const outlet = document.getElementById('outlet');
const router = new Router(outlet);
router.setRoutes([
{path: '/', component: 'x-home-view'},
{path: '/users', component: 'x-users-view'},
{path: '/users/(.*)', component: 'x-user-not-found-view'},
{path: '(.*)', component: 'x-not-found-view'},
]);
index.html
<!DOCTYPE html>
<html>
<head>
<title>[WebStandards template]</title>
<link rel="stylesheet" href="./content/css/style.css">
</head>
<body>
<base href="/">
<a href="/">Home</a>
<a href="/users">All Users</a>
<a href="/users/kim">Kim</a>
<a href="/about">About</a>
<div id="outlet"></div>
<script src="./content/scripts/app.js" type="module"></script>
</body>
</html>
为简洁起见,此处不提供网络组件。但是,它们存在于代码中,单击链接将成功导航到它们。
暂无答案!
目前还没有任何答案,快来回答吧!