关于vue路由<router-link>和<router-view>的小问题

和怎么绑定,我这边不管点击哪个点击标签,所有的标签都会渲染那个的路由。
我想要的是一个只对应一个标签(也就是点击某个只会在对应的中渲染)
放一张失败的图片:
图片说明
求拯救

??????????????????????????????????????????还有代码呢??????????????????????
另外,描述有点懵

添加name属性
app.vue:

 <template>
  <div id="app">
    <div id="">
    <img src="./assets/logo.png">
      <shiyan></shiyan>
      <div id="app1">
          <router-link to='RouterTry' class='iclass'>but1</router-link>
           <router-link to='first' class='iclass'>but2</router-link>
           <router-view class='qwer' name="location1"></router-view>
      </div>
      <div id="app2">
        <router-link to='sceond' class='iclass'>but3</router-link>
           <router-link to='three' class='iclass'>but4</router-link>
           <router-view class='qwer' name="location2"></router-view>
      </div>
    </div>
  </div>
</template>

<script>
import shiyan from '@/components/shiyan.vue'
export default   {
  name: 'app',
  components:{shiyan}

}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
.iclass{font-size: 28px; color: green;}
.qwer{width: 200px; height: 80px; border:  solid 2px black;margin: 0 auto;position: relative;}
</style>

index.js:

 import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/Hello'

import RouterTry from '@/components/RouterTry.vue'
import first from '@/components/first.vue'
import sceond from '@/components/sceond.vue'
import three from '@/components/three.vue'

Vue.use(Router)

var therouter= new Router({
  routes: [
    {
      path: '/',
      name: 'Hello',
      component: Hello
    },
    {
      path: '/RouterTry',
      name: 'RouterTry',
      component: {
          location1:RouterTry
      }
    },
    {
      path: '/first',
      name: 'first',
      component: {
          location1:first
      }
    },
    {
      path: '/sceond',
      name: 'sceond',
      component: {
          location2:sceond
      }
    },
    {
      path: '/three',
      name: 'three',
      component: {
          location2:three
      }
    },
  ]
})
export default therouter