前言

• 本文主要讲解怎么设置项目第一次启动时是自己指定的页面。

开始

• 在项目开始的时候，我遇到这样的一种情况，因为在Web端的话，都是可以显示所有vue页面的，所以可以很好的显示所写页面的效果，如下图所示：

  
  

如上图所示，在浏览器上显示了项目所有的vue页面，包括HelloWorld、Home、index和Login页面，这样只要切换，就可以知道所写的页面效果，可是在Android端却不可以这样，而且说回到Android本身，它指定Android启动页面是通过在AndroidManifest.xml里面设置的，比如Weex项目在Android端第一次启动时的页面就是这样设置的：

        <activity
            android:name="com.weex.app.SplashActivity"
            android:configChanges="orientation|keyboardHidden|screenSize"
            android:label="@string/app_name"
            android:screenOrientation="portrait"
            android:theme="@style/FullscreenTheme">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>

其中，下面所示就是关键代码，想要设置哪个是启动页，就在哪个Activity下面添加即可。

           <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>

但是在Weex项目中，我刚开始并不知道怎么设置Android端第一次（按理说SplashActivity才是第一次启动的页面）出现的是自己想指定的页面，比如登录页面。因为当时我还不明白Weex的跳转机制，并不知道怎么从登陆页面跳转到注册页面，而我如果写好了注册页面，不从登录页面跳转过去，就不能在Android端看到注册页面显示的效果，所以只能通过手动设置项目第一次启动时的页面这个方法来解决。

指定Weex项目第一次启动的页面

• 我们一般将登录页面作为项目第一次启动时的页面，所以，当我们在Weex项目中的src包下写好登录页面Login.vue后，只需在index.vue中通过如下几个步骤设置即可。

步骤一：

<script>
// 1、引入Login.vue页面
import Login from './Login.vue'
export default {

  ......

}
</script>

步骤二：

<script>
// 1、引入Login.vue页面
import Login from './Login.vue'
export default {
  components: {
    // 2、注册组件
    Login
  }
  ......

}
</script>

步骤三：

<template>

    <!-- 3、使用组件 -->
    <Login></Login>

</template>