# Rowing Mode

In the PC, such as the ability to display a large scale display Weixin Mini Program, the Mini Program support in the column mode.The column mode divides the WeChat window into two halves, each showing a page.

Currently, Windows WeChat 3.3 and above supports column mode.For other versions of WeChat, the sidebar mode won't work.

# Enable columning mode

Add both"resizable": trueand"frameset": truein apagejsonTwo configuration items can enable columning mode.

Code example:

{
  "resizable": true,
  "frameset": true
}

Once the column mode is enabled, you can use the automatic preview feature of the developer tools to preview the effect of the column.

# Sections occupy pictures

When a column does not show any pages, a picture is shown in the middle of the column.

If theframeset / placeholder.pngfile in the code package exists, this image will be shown as the image at this point.

# Column alignment points

Some existing code logic may have problems when columning mode is enabled. You may need to change the code to enable it to run correctly in bared mode.

# Avoid using interfaces that change the presentation of a page

Changing the interface that displays the current page always takes effect on the newest page opened.

For example, after opening a new page in the right column, the interface to change the page title wx.setNavigationBarTitle Even calling in a page in the left column will change the title of the page in the right column!

Therefore, you should avoid using such interfaces as much as possible and instead use the page-meta and the navigation-bar components.

# Change routing interface calls

If you use relative paths in a routing interface, it is always relative to the path of the most recently opened page.

For example, after opening a new page in the right column, the routing interface wx.navigateTo Even when called in a page in the left column, the jump path will be relative to the path of the page within the right column!

Therefore, such routing interfaces should be changed to Router interface calls, such asthis.pageRouter.navigateTo。

# Page size is not a fixed value

When you enable columning mode, the page size can change dynamically.Use the Response to Display Area Change method to handle how you respond to page size changes.