Oracle JET Router 与 Module 数据传递
Oracle JET 组件间数据传递方法。
路由:父路由:customers Router 子路由: cust Router
这里 Router 和 module 结合使用。
customer 包括 customers.js 和 customers.html
cust 包括 cust.js 和 cust.html
在 customers 中 cust 以 ojModule 显示。
1. cust.js 中获取父路由方法:
define(['ojs/ojcore', 'knockout', 'jquery'], function (oj, ko, $) {
function cust(params) {
var parentRouter = params.ojRouter.parentRouter;
self.custRouter = parentRouter.createChildRouter('cust');
}
return cust;
})
这里 params 不需要在父路由中传入东西即可使用 params 。使用 params.ojRouter.parentRouter 。即可获取父路由。
使用 parentRouter.createChildRouter('cust') 则可以创建子路由。
注意要使用 return cust ,不能 return new cust()
2. 父子组件通信。
1) customers.js
define(['ojs/ojcore', 'knockout', 'jquery'], function (oj, ko, $) {
function customers() {
this.text = ko.observable('123');
this.customersRouter = oj.Router.rootInstance;
this.customersRouter.configure({
'cust' : {label: 'cust'},
......
})
this.moduleConfig = ko.pureComputed(function() {
return $.extend(true, {}, this.customersRouter.moduleConfig, {
'params': { 'data': 'test','text': this.text}
})
})
}
return customers;
})
2) customers.html
在插入 ojModule 上的地方写上 ojModule: moduleConfig
3) cust.js
define(['ojs/ojcore', 'knockout', 'jquery'], function (oj, ko, $) {
function cust(params) {
var data = params.data;
var text = params.text;
text('456')
}
return cust;
})
子组件直接使用 params.data 就可以直接获取父组件传入的数据。
响应地,子组件更改内容 text('456'),也会反映到父组件之中。
3.在使用 Router 和多层嵌套 module 时需要注意,在 main.js 的 requirejs.config 中需要设置基本的 url ,否则多层嵌套的 module 不会执行。因为 module 路径会默认当前的 url。
如 module 在 http://XXX/ 下默认寻找 views 和 viewModels 在 js 目录下,可寻找成功。
若使用路由 url 变为 http://XXX/customers ,则会变成在 customers/js 目录下寻找 views 和 viewModels 。这样会使寻找文件失败,无法显示 module。
所以,在 main.js 下设置好 baseURL,默认为 baseURL: '/js' 更改为
Oracle JET Router 与 Module 数据传递的更多相关文章
- sqoop实现关系型数据库与hadoop之间的数据传递-import篇
由于业务数据量日益增长,计算量非常庞大,传统的数仓已经无法满足计算需求了,所以现在基本上都是将数据放到hadoop平台去实现逻辑计算,那么就涉及到如何将oracle数仓的数据迁移到hadoop平台的问 ...
- Vue之单文件组件的数据传递,axios请求数据及路由router
1.传递数据 例如,我们希望把父组件的数据传递给子组件. 可以通过props属性来进行传递. 传递数据三个步骤: 步骤1:在父组件中,调用子组件的组名处,使用属性值的方式往下传递数据 <Menu ...
- vue教程3-05 vue组件数据传递、父子组件数据获取,slot,router路由
vue教程3-05 vue组件数据传递 一.vue默认情况下,子组件也没法访问父组件数据 <!DOCTYPE html> <html lang="en"> ...
- Oracle JET 单页面应用程序Router 使用(上)
单页面应用程序:使用一个进加载一次的网页,如果页面由于用户的交互而改变,则仅绘制更改的页面部分. 要创建单页面应用程序需要使用 oj.Router 的虚拟导航来支持,ojModule 用来响应页面的重 ...
- Oracle JET(一)Oracle JET介绍
Oracle JET (Oracle Javascript Extension Toolkit)是一款 Oracle 的 JavaScript 拓展工具包.简单来说 Oracle JET 是一个一堆好 ...
- 无废话Android之smartimageview使用、android多线程下载、显式意图激活另外一个activity,检查网络是否可用定位到网络的位置、隐式意图激活另外一个activity、隐式意图的配置,自定义隐式意图、在不同activity之间数据传递(5)
1.smartimageview使用 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&q ...
- [转]Angular2-组件间数据传递的两种方式
本文转自:https://www.cnblogs.com/longhx/p/6960288.html Angular2组件间数据传递有多种方式,其中最常用的有两种,一种是配置元数据(或者标签装饰),一 ...
- Angular2-组件间数据传递的两种方式
Angular2组件间数据传递有多种方式,其中最常用的有两种,一种是配置元数据(或者标签装饰),一种是用单例模块传递:有两个元数据具有传递数据的功能:inputs和outputs. 一.元数据传递 1 ...
- SpringMVC -- 梗概--源码--壹--数据传递
附:实体类 Class : User package com.c61.entity; import java.text.SimpleDateFormat; import java.util.Date; ...
随机推荐
- iOS常用数学常量宏
在实际工作中有些程序不可避免的需要使用数学函数进行计算,比如地图程序的地理坐标到地图坐标的变换.Objective-C做为ANSI C的扩展,使用C标准库头文件<math.h>中定义的数学 ...
- Qualcomm_Mobile_OpenCL.pdf 翻译-7 内存性能优化
内存优化是最重要也是最有效的OpenCL性能优化技术.大量的应用程序是内存限制而不是计算限制.所以,掌握内存优化的方法是OpenCL优化的基础.在这章中,将会回顾OpenCL的内存模型,然后是最优的实 ...
- JavaScript运算符及语句
ECMAScript 算术运算符 加,减,乘,除,-号可以表示负号 递增(++),递减(--) 两种写法:例:i++,i--,++i,--i,区别是运算符放在前面是先计算后输出,运算符放在后面先输出再 ...
- 解释c# Peek 方法
peek是用来确定你read的文件是否结束了,如果结束了会返回int型 -1 , 举个例子,你可以在输出每一行之前检查一下文件是否结尾,如果没结束就输出此行. StreamReader sr = ne ...
- nasm
sudo apt install nasm 64bit: nasm -f elf64 test.asm ld -s -o test test.o --------------------------- ...
- 清北学堂北京大学吴耀轩神仙讲课day5摘要
今天讲图论 图是啥?(白纸上的符号?) 对于一个拥有n个顶点的无向连通图,它的边数一定多于n-1条.若从中选择n-1条边,使得无向图仍然连通,则由n个顶点及这 n-1条边(弧)组成的图被称为原无向图的 ...
- [易学易懂系列|rustlang语言|零基础|快速入门|(10)|Vectors容器]
[易学易懂系列|rustlang语言|零基础|快速入门|(10)] 有意思的基础知识 Vectors 我们之前知道array数组是定长,只可我保存相同类型的数据的数据类型. 如果,我们想用不定长的数组 ...
- 七、设备驱动中的阻塞与非阻塞 IO(一)
7.1 阻塞与非阻塞 IO 阻塞操作是指在执行设备操作的时候,若不能获取资源,则挂起进程直到满足可操作的条件后再进行操作.被挂起的进程进入睡眠状态,被从调度器的运行队列移走,直到等待的条件被满足. 非 ...
- Python之网路编程之死锁,递归锁,信号量,Event事件,线程Queue
一.死锁现象与递归锁 进程也是有死锁的 所谓死锁: 是指两个或两个以上的进程或线程在执行过程中,因争夺资源而造成的一种互相等待的现象,若无外力作用, 它们都将无法推进下去.此时称系统处于死锁状态或系统 ...
- Vue框架使用sass
引入: cnpm install node-sass --save-dev //安装node-sass cnpm install sass-loader@7.3.1 --save-dev cnpm i ...