IT修真院·坑乎 | Java(后端),CSS(前端),JavaScript(前端),PM(产品经理),UI(交互设计),QA(测试),Android(安卓APP),iOS(苹果APP),OP(运维),Python(后端)日常在线问答学习平台

IT修真院·坑乎 | Java(后端),CSS(前端),JavaScript(前端),PM(产品经理),UI(交互设计),QA(测试),Android(安卓APP),iOS(苹果APP),OP(运维),Python(后端)日常在线问答学习平台

咨询电话 : 010-59478634

亚马逊运营

全部问题

已收录问题

未收录问题

没有找到答案，去提问>>>

该问题已被官方收录

Vue里面的 $event.target.files[0];是什么意思呢

1

1

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<template>
  <div>
    <main>
      <div>
        <div class="new-data-box">
          <span>|</span>
          <span>新增资料</span>
        </div>
        <div class="Data-options-box">
          <!-- 第一个所属科目 -->
          <div>
            <span>所属科目</span>
            <template>
              <el-select v-model="value" placeholder="数学">
                <el-option v-for="item in options" :key="item.value" :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </template>
          </div>
          <!-- 第二个所属科目 -->
          <div>
            <span>所属课程/教材</span>
            <template>
              <el-select v-model="value" placeholder="和差倍问题">
                <el-option v-for="item in optionss" :key="item.valuee" :label="item.labell"
                  :value="item.value">
                </el-option>
              </el-select>
            </template>
          </div>
          <!-- 第三个所属课时 -->
          <div>
            <span>所属课时</span>
            <template>
              <el-select v-model="value" placeholder="全部">
                <el-option v-for="item in optionsss" :key="item.valueee" :label="item.labelll"
                  :value="item.value">
                </el-option>
              </el-select>
            </template>
          </div>
        </div>
        <!-- 第三个新增的资料选项 -->
        <div>
          <!-- 价格部分 -->
          <div>
            <span>价格</span>
            <input type="text" style="width: 30px;">
            <span>元</span>
          </div>
          <!-- 文件上传 -->
          <div>
            <span>文件</span>
            <label class="uupfile" for="upfile">上传</label>
            <input id="upfile"  style="margin-left: 3%;width: 70px;display: none;" type="file" @change="xd">
            <img  :src="PatH" id="upfile"  alt="" style="display: block;margin-left: 9.5%;margin-bottom: 2%;width: 42vw;">
            <table class="image">
              <thead>
                <tr>
                  <th>图片名</th>
                  <th>文件大小</th>
                  <th>进度</th>
                  <th>状态</th>
                  <th>操作</th>
                </tr>
                <tr v-if="imgData">
                  <td>{{imgname}}</td>
                  <td>{{imgSize}}</td>
                  <td class="con">
                   <el-progress :text-inside="true" :stroke-width="18" :percentage="100" status="success"></el-progress>
                  </td>
                  <td></td>
                  <td>
                    <button style="margin-left: 10%;">上传</button>
                    <button style="margin-left: 10%;">删除</button>
                  </td>
                </tr>
              </thead>
            </table>
          </div>
        </div>
      </div>
    </main>
  </div>
</template>
<script>

  export default {
    data() {
      return {
        imgData: false, //未上传图片隐藏图片属性
        PatH:{
          },
          imgUrl:'',
          imgname:'',//图片名字
          imgSize:'',//图片大小
        proBar: 0,
        // 请输入价格的部分
         input: '',
        options: [{
          value: '选项1',
          label: '数学'
        }, {
          value: '选项2',
          label: '语文'
        }, {
          value: '选项3',
          label: '外语'
        }],
        value: '',
        optionss: [{
          valuee: '选项1',
          labell: '和差倍问题'
        }, {
          valuee: '选项2',
          labell: '三年级上册'
        }],
        value: '',
        optionsss: [{
          valueee: '选项1',
          labelll: '全部'
        }, {
          valueee: '选项2',
          labelll: '第一课 标点符号'
        }]
      }
    },
    methods:{
      xd($event){
        let file = $event.target.files[0];//声明
        this.imgData= true//未上传图片隐藏图片属性
        this.imgname=file.name//点击的时候让图片名字显示
      }
    }
  }
</script>
<style lang="scss" scoped>
// 新增资料外部样式
  .new-data-box{
    display: flex;
    align-items: center;
    text-align: left;
    height: 40px;
    background-color: cornflowerblue;
  }
  // 条件新增资料外部盒子
  .Data-options-box{
    height: 170px;
    border: 1px solid;
    padding-top: 50px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 20px;
  }
  .uupfile{
    border: 1px solid;
    background-color: cadetblue;
  }
</style>
}

该问题已被官方收录

小程序储存选择条件的方法

0

1

小程序语言基础

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

wx.navigateTo({
  url: `../xxx/xxx?product_list=${choose_lists}`
})
或者
wx.setStorage(object) 
wx.getStorage(object)

该问题已被官方收录

关于使用富文本编辑器

0

1

富文本编辑器

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

--------------------------------------------------------------------------------HTML部分------------------------------------------------------
<template>
    <el-row>
        <!-- 右边新增列表 -->
      <div style="margin-left: 2%;margin-top: 2%;width: 73.7%;box-shadow: -1px 0px 7px #888888;">
        <p class="newArticle">新增Article</p>
        <!-- 新增下面盒子 -->
        <div class="parameter">
          <div style="margin-left: 12%;margin-bottom: 2%;padding-top: 3%;">
            <span>标题名称</span>
            <input style="width: 80%;margin-left: 3%;" type="text" v-model="xd.title">
          </div>
          <div style="margin-left: 12%;margin-bottom: 2%;">
            <span>类       型</span>
            <select style="margin-left: 3%;" v-model="xd.type">
              <option value="">请选择</option>
              <option value="0">首页Banner</option>
              <option value="1">找职位Banner</option>
              <option value="2">找精英Banner</option>
              <option value="3">行业大图</option>
            </select>
          </div>
          <div style="margin-left: 12%;margin-bottom: 2%;">
            <span>说       明</span>
             <quill-editor style="width: 80%;float: right;margin-right: 11%;"  v-model="content"
               :options="editorOption"
               @blur="onEditorBlur($event)"
               @focus="onEditorFocus($event)"
               @change="onEditorChange($event)">
            </quill-editor>
          </div>
          <div style="margin-left: 12%;margin-bottom: 2%;margin-top: 14%;">
            <span>跳转链接</span>
            <input v-model="xd.url" style="width: 80%;margin-left: 3%;" type="text">
          </div> 
          <div style="margin-left: 12%;margin-bottom: 2%;">
            <span>配       图</span>
            <label class="uupfile" for="upfile">选择文件</label>
            <input id="upfile"  style="margin-left: 3%;width: 70px;display: none;" type="file" @change="upfileFile">
            <img ref="nam" :src="xd.imgurl" alt="配图预览" style="display: block;margin-left: 9.5%;margin-bottom: 2%;width: 42vw;">
            <table class="image">
              <thead>
                <tr>
                  <th>图片名</th>
                  <th>文件大小</th>
                  <th>进度</th>
                  <th>操作</th>
                  <th>操作</th>
                </tr>
                <tr v-if="imgData">
                  <td>{{imgName}}</td>
                  <td>{{imgSize}}</td>
                  <td class="con">
                    <span class="bar" :style="{width:proBar+'%'}">{{proBar}}%</span>
                  </td>
                  <td>{{imgStatus}}</td>
                  <td>
                    <button @click="upload" style="margin-left: 10%;">上传</button>
                    <button @click="deletee" style="margin-left: 10%;">删除</button>
                  </td>
                </tr>
              </thead>
            </table>
          </div>
          <div style="padding-bottom: 3%;">
            <el-row>
            <el-button type="success" :disabled="btn" @click="goOnline(2)" class="online">立即上线</el-button>
            <el-button type="success" :disabled="btn" @click="goOnline(1)" class="draft">存为草稿</el-button>
            <el-button @click="cancell" class="cancel">取消 </el-button>
            </el-row>
          </div>
        </div>
      </div>
      </el-row>
</template>
-------------------------------------------------------------------------JS部分------------------------------------------------------------
<script>
  import axios from "axios";
  import {
    article
  } from "@/http/article.js";
  import qs from 'qs';
  export default {
    data() {
      return {
        files: null,
        jobShow: false,
        job: "",
        proBar: 0,
        titleee: "", //新增或编辑
        imgName: "", //图片预览名称
        imgSize: "", //图片预览大小
        imgData: false, //未上传图片隐藏图片属性
        imgStatus: "", //图片预览状态
        url: '',
        uurl: '',
        newUrl: '',
        xd: {
          title: "",
          type: "",
          url: "",
          imgurl: ""
        },
        background: false,
        CompanyLocation: false,
        Article: false,
        listt: [],
        reader: {},
        contentt: '',
        btn: true
      }
    },
    methods: {
      // 图片上床东西
      clear() {
        this.imgName = "",
          this.imgSize = "",
          this.imgStatus = "",
          this.proBar = 0,
          this.imgStatus = "未选择图片"
      },
      //上线 草稿确认按钮
      goOnline(status) {
        if (this.newUrl == "") {
          this.uurl = this.oldUrl;
        } else if (this.newUrl != "") {
          this.uurl = this.newUrl;
        }
        console.log(this.uurl)
        if (this.uurl === "") {
          alert("请上传图片");
          return;
        }
        let params = {
          content: this.content,
          title: this.xd.title,
          status: status,
          img: this.uurl,
          url: this.xd.url,
          createAt: this.createAt,
          type: this.xd.type,
        }
        let paramss = {
          content: this.content,
          title: this.xd.title,
          status: status,
          img: this.uurl,
          url: this.xd.url,
          type: this.xd.type,
        }
          console.log(paramss)
          article.addArticle(paramss)
            .then(res => {
              console.log(res)
              this.$router.push({
                path: "personal"
              });
              // alert("新增成功")
            })
          console.log(this.btn)
        // }
      },
      cancell() {
        this.$router.push({
          path: "personal"
        });
      },
      //上传
      upload() {
        this.imgStatus = "上传中";
        let that = this;
        let config = {
          //动态改变上传进度条
          onUploadProgress(progressEvent) {
            //    console.log(onUploadProgress)
            console.log(this)
            that.proBar =
              ((progressEvent.loaded / progressEvent.total) * 100) | 0;
            console.log(this.proBar)
          }
        };
        console.log(this.proBar)
        article.uploadImg(this.fileDataa, config)
          .then(res => {
            this.imgStatus = "上传成功";
            let url = res.data.data.url;
            this.newUrl = url;
          })
          .catch(error => {
            this.imgStatus = "上传失败";
          })
        console.log('成功否')
      },

该问题已被官方收录

如何上传图片并预览

2

1

file-upload

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

暂无

该问题已被官方收录

获取服务器的时间

0

1

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

$rootScope.getTimeNow = function getServerDate(){
        var xhr = null;
        if(window.XMLHttpRequest){
            xhr = new window.XMLHttpRequest();
        }else{ // ie
            xhr = new ActiveObject("Microsoft")
        }

        xhr.open("GET","/",true);
        xhr.send(null);
        xhr.onreadystatechange=function(){
            var time,date;
            if(xhr.readyState == 2){
                time = xhr.getResponseHeader("Date");
                date = new Date(time);
                console.log(date);
            }
        }
    }

该问题已被官方收录

angular页面下的css样式设置

0

1

js基础

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
    <link rel="stylesheet" href="https://cdn.bootcss.com/normalize/8.0.0/normalize.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="css/login.css">
    <link rel="stylesheet" href="css/back-welcome.css">
    <link rel="stylesheet" href="css/article.css">
    <script rel="script" src="http://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script rel="script" src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script rel="script" src="https://cdn.bootcss.com/angular.js/1.7.0/angular.min.js"></script>
    <script rel="script" src="https://cdn.bootcss.com/angular-ui-router/1.0.18/angular-ui-router.min.js"></script>
    <script rel="script" src="js/bootstrap-datetimepicker.min.js" charset="UTF-8"></script>
    <script rel="script" src="js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
    <script rel="script" src="js/app.js"></script>
    <script rel="script" src="js/login.js"></script>
</head>
<body data-ng-app="app">
    <div data-ui-view=""></div>
</body>
</html>


<div class="header">
    <a class="slide">萝卜多后台管理系统</a>
    <div class="role">管理员</div>
    <div class="name">admin</div>
    <a class="out glyphicon glyphicon-off" ui-sref="login"></a>
</div>

<div class="slidebar">
    <div class="dropdown">
        <button class="btn dropdown-toggle" type="button" id="menu1" data-toggle="dropdown">信息管理
            <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
            <li role="presentation"><a role="menuitem" tabindex="-1">公司列表</a></li>
            <li role="presentation"><a role="menuitem" tabindex="-1">职位列表</a></li>
        </ul>
    </div>
    <div class="dropdown">
        <button class="btn dropdown-toggle" type="button" id="menu2" data-toggle="dropdown">后台管理
            <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu" aria-labelledby="menu2">
            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">账号管理</a></li>
            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">角色管理</a></li>
            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">修改密码</a></li>
            <li role="presentation" ui-sref=".article_new"><a role="menuitem" tabindex="-1" href="">模块管理</a></li>
            <li role="presentation" ui-sref=".article"><a role="menuitem" tabindex="-1" href="">article列表</a></li>
        </ul>
    </div>
</div>

<div class="content">
    <div ui-view="">
        Welcome!
    </div>
</div>


var app = angular.module("app", ['ui.router']);

app.config(function ($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.when("", "/home");

    $stateProvider
        .state("home", {
            url: "/home",
            templateUrl: "home.html"
        })
        .state("login", {
            url:"/login",
            templateUrl: "login.html"
        })
        .state("home.article", {
            url:"/article",
            templateUrl: "article.html"
        })
        .state("home.article_new", {
            url:"/article_new",
            templateUrl: "article_new.html"
        });
});

该问题已被官方收录

编辑页面，获取文章数据后，select设置value不能显示选项

0

1

angular model

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

解决办法：查阅官方文档如下

Caveat: Option selection
Angular uses object identity to select option. It's possible for the identities of items to change while the data does not. This can happen, for example, if the items are produced from an RPC to the server, and that RPC is re-run. Even if the data hasn't changed, the second response will produce objects with different identities.

To customize the default option comparison algorithm, <select> supports compareWithinput.compareWith takes a function which has two arguments: option1 and option2. If compareWith is given, Angular selects option by the return value of the function.

Syntax

<select [compareWith]="compareFn"  [(ngModel)]="selectedCountries">
 <option *ngFor="let country of countries" [ngValue]="country">
   {{country.name}}
 </option>
</select>
compareFn(c1: Country, c2: Country): boolean {
return c1 && c2 ? c1.id === c2.id : c1 === c2;
}
 

按此法成功解决

解决方法二：用ng-select插件

Step 1: Install ng-select:
npm install --save @ng-select/ng-select

Step 2: Import the NgSelectModule and angular FormsModule module:

import { NgSelectModule } from '@ng-select/ng-select';
import { FormsModule } from '@angular/forms';
@NgModule({
 declarations: [AppComponent],
 imports: [NgSelectModule, FormsModule],
 bootstrap: [AppComponent]
})
export class AppModule {}
Step 3: Include a theme:
To allow customization and theming, ng-select bundle includes only generic styles that are necessary for correct layout and positioning. To get full look of the control, include one of the themes in your application. If you're using the Angular CLI, you can add this to your styles.scss or include it in .angular-cli.json(Angular v5 and below) or angular.json (Angular v6 onwards).


@import "~@ng-select/ng-select/themes/default.theme.css";
// ... or  
@import "~@ng-select/ng-select/themes/material.theme.css";

该问题已被官方收录

法官台本页面this 指向

0

1

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

for (var i = 0; i < daynum; i++) {
  var gameday = content[i].querySelector('.gameday');
  // 游戏状态
  gameday.textContent = num2han(i + 1);
  // 天数行添加点击函数显示隐藏  
  contentHead[i].onclick = function () {
    var nextNode = this.nextElementSibling;
    switch (true) {
      case nextNode.style.display == "" || nextNode.style.display == 'block':
        nextNode.style.display = 'none';
        break;
      case nextNode.style.display == 'none':
        nextNode.style.display = 'block';
    }
  }
}
// 设置隐藏和点击效果
for (var i = 0; i < daynum - 1; i++) {
  var order = content[i].querySelectorAll('.play-order');

  contentHead[i].nextElementSibling.setAttribute('style', 'display: none');
  for (var j = 0; j < 4; j++) {
    order[j].setAttribute('class', 'play-order-click');
  }
}

该问题已被官方收录

用Angela写手风琴怎么解决染色问题

0

1

angular基础

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

   $scope.toggle = function (index) {
            var index1 = index
            $scope.listDown[index].show = !$scope.listDown[index].show ;
           $scope.listDown[index].lala = !$scope.listDown[index].lala;
           for (let i=0; i<3;i++){
               if(i != index){
                   $scope.listDown[i].lala =true;
                   $scope.listDown[i].show =false;
               }
           }
           $scope.toggle1 = function (index) {
            $scope.listDown[index1].show =false;
             
             $(".list").removeClass('color');
            $scope.listDown[index1].child[index].show1 = true ;
            if(index1==0 && index == 0){
                $state.go('list.1')
            }
            if(index1==0 && index ==1){
                $state.go('list.2')
            }
           
           
            for(let i=0; i<$scope.listDown[index1].child.length; i++ ){
              if(i != index){
                $scope.listDown[index1].child[i].show1 = false ;

              
              }
                
            }
          

        }
        }

该问题已被官方收录

双向绑定失效

0

1

class="cursor-pointer"> 详细描述

class="cursor-pointer"> 截图

class="cursor-pointer"> 代码

        //获取邮箱验证码
        vm.toGetEmailCode=function(){
            projectService.getEmailCode(vm.id,vm.newEmail).then(function(res){
                if(res.data.code===0){
                    console.log(res);
                    vm.Emailvcode=$interval(function(){
                        if(vm.second <= 0){
                            $interval.cancel(vm.Emailvcode);
                            vm.second=59;
                            vm.EmailDescription="获取验证码";
                            vm.clickEmail=false;
                        }else{
                            vm.EmailDescription=vm.second+"s后获取";
                            vm.clickEmail=true;
                            vm.second--;
                        }
                    },1000);
                }else{
                    alert("验证码失败")
                }
            })
        };
        //创建请求参数对象
        vm.bt= {
            id: vm.id,
            vCode: vm.telCode,
            bindingTool: vm.newTel
        };

        //提交手机绑定修改
        vm.saveModify=function () {
            projectService.bindTel(vm.bt).then(function (res) {
                if(res.data.code===0){
                    console.log("手机绑定成功");
                    console.log(res);
                    console.log(vm.bt);
                    // $state.go('bindingInfo');
                }else{
                    alert("提交失败")
                }
            });
        };

去第页

Copyright ©2015 北京葡萄藤信息技术有限公司 All Rights Reserved | 京ICP备15035574号-1