问题
我正在尝试编写一个单页应用程序(SPA),其中该应用程序最初显示模块“ A”。当用户单击“ A”中的元素时,将显示模块“ B”并从A传递ID。(例如,A显示了一个雇员ID列表,单击一个雇员意味着B将显示该雇员的详细信息)] >
最初,我的网址是:
http://localhost:8000/
单击A中ID为123的项目,URL更改为以下正确的URL:
http://localhost:8000/A/123
但是,出现以下错误
GET http://localhost:8000/b/js/viewModels/B.js net::ERR_ABORTED 404 (Not Found) ojModule failed to load viewModels/B ojlogger.js:257 Error: Script error for "viewModels/B"
我不知道为什么它更改了路径并添加了额外的“ / b /”来获取B.js / B.html文件。当然,它找不到此文件,因为我的项目结构中没有这样的文件夹“ b”。
Oracle Jet Cookbook示例
https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=router&demo=stateParams
我正在使用OracleJet Cookbook中的示例作为带有状态参数的路由器。如果以全屏模式打开此示例,则会看到第一个屏幕(A)的URL为
https://www.oracle.com/webfolder/technetwork/jet/content/router-stateParams/demo.html
单击列表中的某个人会将URL更改为以下内容,与我的相同。
https://www.oracle.com/webfolder/technetwork/jet/content/router-stateParams/demo.html/detail/7566
此食谱样本不会像我的一样出错。
我的代码
项目结构
src |- index.html |- js |- main.js |- viewModels |- A.js |- B.js |- views |- A.html |- B.html
index.html
.... <body> <div id="routing-container"> <div data-bind="ojModule:router.moduleConfig"></div> </div> </body> ....
main.js
requirejs.config( { baseUrl: 'js', .... } require(['ojs/ojbootstrap', 'ojs/ojrouter', 'knockout', 'ojs/ojmodule-element-utils', 'ojs/ojknockout', 'ojs/ojmodule'], function (Bootstrap, Router, ko) { // Retrieve the router static instance and configure the states var router = Router.rootInstance; router.configure({ 'a': {label: 'a', value: 'A', isDefault: true}, 'b/{id}': {label: 'b', value: 'B' } }); var viewModel = { router: router }; Bootstrap.whenDocumentReady().then( function(){ ko.applyBindings(viewModel, document.getElementById('routing-container')); Router.sync(); } ); });
A.html
.... <div on-click="[[onClicked]]" > .... </div> ...
A.js
define(['ojs/ojcore', 'ojs/ojrouter', 'knockout', '], function (oj, Router, ko) { function AViewModel(params) { .... router = Router.rootInstance; .... this.onClicked= function(event) { router.go('b/'+ 123); } .... }; } return AViewModel; }
尝试
我已经尝试在“ main.js”中添加以下内容之一,并且没有区别。
Router.defaults['baseUrl'] = '';
Router.defaults['baseUrl'] = 'js';
Router.defaults['baseUrl'] = '/js';
Router.defaults['baseUrl'] = '/js/';
问题,我正在尝试编写一个单页应用程序(SPA),其中该应用程序最初显示模块“ A”。当用户单击“ A”中的元素时,将显示模块“ B”并从A传递ID。(对于...
我终于在同事的建议下解决了这个问题。