未验证 提交 351a955a 编写于 作者: 葛亚芳 提交者: Gitee

update zh-cn/application-dev/quick-start/start-with-js.md.

Signed-off-by: N@ge-yafang <geyafang@huawei.com>
上级 79f8f0f6
......@@ -43,7 +43,8 @@
工程同步完成后,在“**Project**”窗口,点击“**entry &gt; src &gt; main &gt; js &gt; MainAbility &gt; pages&gt; index**”,打开“**index.hml**”文件,设置Text组件内容。“**index.hml**”文件的示例如下:
```
```html
<!--index.hml-->
<div class="container">
<text class="title">
Hello World
......@@ -55,7 +56,8 @@
在默认页面基础上,我们添加一个button类型的input组件,作为按钮响应用户点击,从而实现跳转到另一个页面。“**index.hml**”文件的示例代码如下:
```
```html
<!--index.hml-->
<div class="container">
<text class="title">
Hello World
......@@ -70,7 +72,7 @@
在“**Project**”窗口,点击“**entry &gt; src &gt; main &gt; js &gt; MainAbility &gt; pages&gt; index**”,打开“**index.css**”文件,可以对页面中文本、按钮设置宽高、字体大小、间距等样式。“**index.css**”文件的示例如下:
```
```css
.container {
display: flex;
flex-direction: column;
......@@ -117,7 +119,8 @@
参照第一个页面,在第二个页面添加文本、按钮及点击按钮绑定页面返回等。“**second.hml**”文件的示例如下:
```
```html
<!--second.hml-->
<div class="container">
<text class="title">
Hi there
......@@ -130,7 +133,7 @@
3. 设置页面样式。“**second.css**”文件的示例如下:
```
```css
.container {
display: flex;
flex-direction: column;
......@@ -169,7 +172,8 @@
在第一个页面中,跳转按钮绑定onclick方法,点击按钮时跳转到第二页。“**index.js**”示例如下:
```
```js
// index.js
import router from '@ohos.router';
export default {
......@@ -185,7 +189,8 @@
在第二个页面中,返回按钮绑定back方法,点击按钮时返回到第一页。“**second.js**”示例如下:
```
```js
// second.js
import router from '@ohos.router';
export default {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册