DEV Community

wei chang
wei chang

Posted on

Harmonyos Cangjie Development Language Practical Tutorial: Page Jump and Parameter Passing

Two days ago, the home page and product detail page of the mall application were respectively realized. Today, I'm going to share new content, which is the mutual jump and parameter transmission between these two pages.

First of all, we need two pages. If there is no second page in your project yet, you can right-click the cangjie folder to create a new cangjie file:

Image description

There is not much content in the newly created file. Let's add four basic references to it and simply add a button:

package ohos_app_cangjie_entry.page
import ohos.base.*
import ohos.component.*
import ohos.state_manage.*
import ohos.state_macro_manage.*
@Entry
@Component
public class testPage {
    func build() {
        Column {
            Button('返回')
        }
    }
}
Enter fullscreen mode Exit fullscreen mode

Page jump and return

Cangjie language has the same Router as ArkTs, but its usage is a bit different. When jumping to a page, the url used by push is no longer a path but directly the page name, a path that can be ignored. For example, when I just created a new page called testPage, the jump was:

Router.push(url: 'testPage')
Enter fullscreen mode Exit fullscreen mode

When the page needs to be returned, use Router.back(). The url parameter can be written in the back or not.

It should be noted that the page name we refer to here is not the name of the file, but the name of the page. For example, in the index.cj file, its page name is EntryView instead of index.

Image description

Pass parameters

Page jumps are usually accompanied by parameter passing. When using push jump, you can see that there is also a params parallel to the url for parameter passing, which supports two types: string and JsonObject.

When only one parameter needs to be passed, we can directly pass a parameter of type string:

Router.push(url: 'testPage', params: '100')
Enter fullscreen mode Exit fullscreen mode

When receiving parameters on the next page, Router should also be used:

Router.getParams()
Enter fullscreen mode Exit fullscreen mode

Similarly, when returning to the previous page, parameters can also be passed in the same way, and the same applies to receiving parameters.

Router.back(url: 'EntryView',params:'参数2')
Enter fullscreen mode Exit fullscreen mode

When multiple parameters need to be passed, we need to use the JsonObject type, which is a brand-new data type. When using it, Youlan Jun had quite a lot of trouble. Fortunately, friends who have read this article don't need to waste time anymore. It's used like this:

var map = JsonObject()
map.put("name", JsonString("衬衫"))
map.put(“size”, JsonString(“xl”))
Router.push(url: 'testPage', params: map)
Enter fullscreen mode Exit fullscreen mode

When receiving multiple parameters on the next page, Router.getParamsObject() should be used:

let obj =  Router.getParamsObject()
let a =  obj['name']    



AppLog.info('接收多个参数:' + a.toString())
Enter fullscreen mode Exit fullscreen mode

The above is the page jump and parameter passing in the Cangjie development language. #HarmonyOS Language ## Cangjie ## Shopping #

Top comments (0)