账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue的页面一进来想触发一个点击事件 默认让他选中第一个
    31
    0

    这是我冲另一个页面点击跳转到了这个页面 (这个页面的地址是/admin) 我想的是进来就让他默认选中第一个 加载第一个组件 我有七个路由 每个路由对应着右边 但是这七个路由都写在/admin下的子路由 有什么方法能一进来就触发一次点击事件 让第一个选中 地址也会改变为第一个的路由 有点乱这个 我不知道我这种路由嵌套方式正确不 因为我一进来右边是没有东西的 只有点击之后才会出现相应的组件 大哥大姐们 帮我解答下

    <div class="admin">
        <el-container>
          <el-container class="adminheader">
              <el-header >后台管理</el-header>
          </el-container>
          <el-container class="hahaha">
            <el-aside style="width:240px;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.349019607843137);height:100%;background:#eee" class="elslide">
             <el-menu
      default-active="1"
      class="el-menu-vertical-demo inner-container" 
     >
      <router-link to="/adminstystemcontrol">
      <el-menu-item id="target" index="1" @click="handleonceclick">
        <i class="el-icon-menu"></i>
        <span slot="title">后台管理</span>
      </el-menu-item></router-link>
    
     <router-link to="/audit">
      <el-menu-item index="2">
        <i class="el-icon-menu"></i>
        <span slot="title">开通审核</span>
      </el-menu-item></router-link>
    
       <router-link to="/signup">
      <el-menu-item index="3">
        <i class="el-icon-menu"></i>
        <span slot="title">平台签约业务员</span>
      </el-menu-item></router-link>
    
       <router-link to="/score">
      <el-menu-item index="4">
        <i class="el-icon-menu"></i>
        <span slot="title">返现积分</span>
      </el-menu-item></router-link>
    
       <router-link to="/advertising">
      <el-menu-item index="5">
        <i class="el-icon-menu"></i>
        <span slot="title">广告设定</span>
      </el-menu-item></router-link>
    
       <router-link to="/live">
      <el-menu-item index="6">
        <i class="el-icon-menu"></i>
        <span slot="title">直播审核</span>
      </el-menu-item></router-link>
    
       <router-link to="/shoping">
      <el-menu-item index="7">
        <i class="el-icon-menu"></i>
        <span slot="title">积分商城</span>
      </el-menu-item></router-link>
    </el-menu>
                
            </el-aside>
            <el-main>
                
                <div v-if="nana">
                    <adminstystemcontrol></adminstystemcontrol>
                </div>
                    <router-view></router-view>
            </el-main>
          </el-container>
        </el-container>
    </div>

    </template>

    <script>
    import adminstystemcontrol from '@/components/manageWebManage/adminstystemcontrol/adminstystemcontrol';

    export default {
        data(){
            return {
                nana:false
            }
        },
        components:{
            adminstystemcontrol
        },
        created(){
            this.handleonceclick()
        },
        
        methods:{
            handleonceclick(){
                let url = window.location.href;
                
                let bool = url.indexOf('Admin');
                if(bool!==-1){
                    this.nana = true
                }
            }
        }
    }

    </script>

    <style scoped>

    .adminheader{
        background: rgba(0, 153, 255, 1);
        width: 100%;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 1;
    }
    .adminheader .el-header{
        font-size: 24px;
        color: #fff;
        line-height: 56px;
        font-weight: 700;
        
    
    }
    .hahaha{
        width: 90%;
        position: fixed;
        left:5%;
        top: 60px;
        bottom: 0;
        background:#eee;
    }
    .inner-container{
        background:#eee;
        color:#000;
    
    }
    .elslide::-webkit-scrollbar {
    display: none;

    }

    </style>

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 在 Vue 中,你可以使用 v-model 来绑定数据到双向绑定的绑定器。v-model 可以让两个输入框的值对应,并且可以自动更新页面中的值。在你想要触发点击事件的页面一进来,你可以这样绑定 v-model

      html <input type="text" v-model="selectedText" @input="handleInput">

      在上面的代码中,selectedText 是绑定器,它会将输入框的值赋值给 selectedText。当输入框的内容发生改变时,handleInput 方法会被调用,从而触发点击事件。

      然后,你可以这样在页面上触发点击事件:

      js handleInput() { alert("你选择了 " + selectedText); }

      在上面的代码中,当你在输入框中输入内容并点击时,handleInput 方法会被调用,并显示一个警告框,显示你选择的内容。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部