From 55f4bb01879420538c0cb4b53530e82bea8c3c34 Mon Sep 17 00:00:00 2001
From: jimczj <jimczj@gmail.com>
Date: Thu, 8 Nov 2018 11:59:08 +0800
Subject: [PATCH] =?UTF-8?q?feat(navbar):=20=E6=96=B0=E5=A2=9E=E4=B8=8B?=
 =?UTF-8?q?=E5=88=92=E7=BA=BF=E6=8E=A7=E5=88=B6=E5=8F=98=E9=87=8F=20#162?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 @types/nav-bar.d.ts                  |  2 ++
 docs/markdown/navbar.md              |  1 +
 src/components/nav-bar/index.js      |  6 +++++-
 src/components/nav-bar/index.scss    |  6 ++++++
 src/pages/navigation/navbar/index.js | 18 ++++++++++++++++++
 5 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/@types/nav-bar.d.ts b/@types/nav-bar.d.ts
index f027c68ba..9090ecca7 100644
--- a/@types/nav-bar.d.ts
+++ b/@types/nav-bar.d.ts
@@ -10,6 +10,8 @@ export interface AtNavBarProps extends AtComponent{
 
   fixed?: boolean
 
+  border?: boolean
+
   color?: string
 
   leftIconType?: string
diff --git a/docs/markdown/navbar.md b/docs/markdown/navbar.md
index 7898798e4..a1459df02 100644
--- a/docs/markdown/navbar.md
+++ b/docs/markdown/navbar.md
@@ -40,6 +40,7 @@ import { AtNavBar } from 'taro-ui'
 | ---------- | -------------------------------------- | ------- | ------------------------------------------------------------------- | -------- |
 | color | 链接文字跟图标颜色，不包括标题 | Number  | - | `#6190E8` |
 | fixed | 是否固定顶部  | Boolean | - | false |
+| border | 是否显示下划线(v1.4.0 新增)  | Boolean | - | true |
 | leftIconType  | 左边图标类型，图标类型请看`AtIcon`文档  | String | - | 'chevron-left' |
 | leftText | 左边文字 | String  | - | - |
 | title | 标题文字 | String  | - | - |
diff --git a/src/components/nav-bar/index.js b/src/components/nav-bar/index.js
index b1f05fb9c..48a69f024 100644
--- a/src/components/nav-bar/index.js
+++ b/src/components/nav-bar/index.js
@@ -14,6 +14,7 @@ export default class AtNavBar extends AtComponent {
     customStyle: '',
     className: '',
     fixed: false,
+    border: true,
     color: '#6190E8',
     leftIconType: '',
     leftText: '',
@@ -35,6 +36,7 @@ export default class AtNavBar extends AtComponent {
       PropTypes.string
     ]),
     fixed: PropTypes.bool,
+    border: PropTypes.bool,
     color: PropTypes.string,
     leftIconType: PropTypes.string,
     leftText: PropTypes.string,
@@ -64,6 +66,7 @@ export default class AtNavBar extends AtComponent {
       className,
       color,
       fixed,
+      border,
       leftIconType,
       leftText,
       title,
@@ -76,7 +79,8 @@ export default class AtNavBar extends AtComponent {
       className={
         classNames({
           'at-nav-bar': true,
-          'at-nav-bar--fixed': fixed
+          'at-nav-bar--fixed': fixed,
+          'at-nav-bar--no-border': !border
         }, className)
       }
       style={customStyle}
diff --git a/src/components/nav-bar/index.scss b/src/components/nav-bar/index.scss
index 98d1b974a..9182dac18 100644
--- a/src/components/nav-bar/index.scss
+++ b/src/components/nav-bar/index.scss
@@ -15,6 +15,12 @@ $font-size: 18PX;
   overflow: hidden;
   @include hairline-bottom();
 
+  &--no-border {
+    &::after {
+      border-bottom-width: 0;
+    }
+  }
+
   &--fixed {
     position: fixed;
     top: 0;
diff --git a/src/pages/navigation/navbar/index.js b/src/pages/navigation/navbar/index.js
index ce6336bba..59e8000e7 100644
--- a/src/pages/navigation/navbar/index.js
+++ b/src/pages/navigation/navbar/index.js
@@ -115,6 +115,24 @@ export default class Index extends Taro.Component {
               />
             </View>
           </View>
+
+          {/* 无下划线 */}
+          <View className='panel'>
+            <View className='panel__title'>无下划线</View>
+            <View className='panel__content no-padding'>
+              <AtNavBar
+                border={false}
+                onClickRgIconSt={this.clickList.bind(this)}
+                onClickRgIconNd={this.clickMy.bind(this)}
+                onClickLeftIcon={this.clickReturn.bind(this)}
+                color='#333'
+                title='NavBar 导航栏示例'
+                leftText='返回'
+                rightFirstIconType='bullet-list'
+                rightSecondIconType='user'
+              />
+            </View>
+          </View>
         </View>
       </View>
     )