鍍金池/ 問答/ HTML問答
朕略萌 回答

管理系統(tǒng)的權(quán)限控制,之前做的是,根據(jù)登錄的角色權(quán)限一次獲取所有的菜單列表循環(huán)上去。
你這樣層級(jí)獲取的目的是?菜單列表數(shù)量巨大的原因?

拼未來 回答
<div class="row">
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
  <div class="col"></div>
</div>
<style>
  .row {
    width: 300px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
  }
  .col{
    flex: 0 0 33.333333%;
    height: 80px;
    box-sizing: border-box;
    border: 1px solid #dcdfe6;
  }
</style>
北城荒 回答

底部的彈框加個(gè)回調(diào)監(jiān)聽touchmove(高版本chrome注意第三個(gè)參數(shù),否則會(huì)報(bào)錯(cuò)),然后preventDefault()或者阻止冒泡

莫小染 回答
  1. 復(fù)寫了 這個(gè)空注釋節(jié)點(diǎn)(createComment)的 setAttribute 方法為一個(gè)不會(huì)產(chǎn)生任何作用的函數(shù),可能是為了防止后續(xù)操作的報(bào)錯(cuò)吧,因?yàn)樵臼?dom 節(jié)點(diǎn),肯定會(huì)有對(duì) dom 的屬性的操作的,而換成注釋節(jié)點(diǎn)后不能設(shè)置屬性?(不清楚)。
  2. vnode 是虛擬節(jié)點(diǎn),可以把 vnode 當(dāng)做實(shí)際節(jié)點(diǎn)創(chuàng)建的前身。你看把原本要?jiǎng)?chuàng)建的 elm 就換成了一個(gè)注釋節(jié)點(diǎn),就創(chuàng)建不出來原本的 element 了。存儲(chǔ)了要?jiǎng)?chuàng)建的節(jié)點(diǎn)的一些信息,和創(chuàng)建使用的方法。把 vnode 上的 節(jié)點(diǎn)相關(guān)信息清空或修改,就創(chuàng)建不出來原本的節(jié)點(diǎn)結(jié)構(gòu)了。
情未了 回答

我分享下我的前后臺(tái)請(qǐng)求的邏輯
這個(gè)是axios的:

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
//axios.defaults.headers.post['Content-Type'] = 'multipart/form-data'
axios.defaults.retry = 4
axios.defaults.timeout = 10000
axios.defaults.withCredentials = true
// code狀態(tài)碼200判斷
axios.interceptors.response.use((res) => {
    if(res.status === 654) {
        console.log('請(qǐng)求超時(shí)!')
    }
    if(res.data.code < 200 && res.data.code >= 300) {
        console.error('數(shù)據(jù)返回有誤')
        return Promise.reject(res)
    }
    return res
}, (error) => {
    let config = error.config
    if(!config || !config.retry) return Promise.reject(error)
    config.__retryCount = config.__retryCount || 0
    
    if(config.__retryCount >= config.retry) {
        console.log('promise error:' + error)
        return Promise.reject(error)
    }
    config.__retryCount += 1
    
    let backoff = new Promise(function(resolve) {
        setTimeout(function() {
            resolve()
        }, config.retryDelay || 1)
    })
    
    return backoff.then(function() {
        return axios(config)
    })
})

Node使用express搭建的服務(wù)器:

// 跨域設(shè)置
app.all("*", function(req, res, next) {
    if(req.path !== "/" && !req.path.includes(".")) {
        res.header("Access-Control-Allow-Credentials", true);
        // 這里獲取 origin 請(qǐng)求頭 而不是用 *
        res.header("Access-Control-Allow-Origin", req.headers["origin"] || "*");
        res.header("Access-Control-Allow-Headers", 'Content-Type,Content-Length, Authorization,\'Origin\',Accept,X-Requested-With');
        res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
        res.header("Content-Type", "application/json;charset=utf-8");
    }
    let ip = getClientIp(req)
    ul.getByIP(ip)
    io.emit('updateMapBack', JSON.stringify(m.getMap()))

    next();
});
做不到 回答

謝謝上面兩位的回答。但是兩位的方法我都實(shí)踐過了,都是不行呢。
所以我直接加了這個(gè)方法暴力改變寬度了

            changeWidth(){
                let element = document.querySelector("#elDialog>.el-dialog")
                element.style.width = '1500px'
            },

因?yàn)橛胻his.$refs.elDialog綁定的elementUI組件的話,
直接 this.$refs.elDialog.style.width = '1500px' 的權(quán)限是不夠高的,就是說雖然能改變,但是是無法展示。

如果用this.$refs.elDialog.width = '1500px'的話,由于我是用的區(qū)域是數(shù)據(jù)父組件(相對(duì)于elementUI的dialog組件來說,這里嵌套了很多層了),所以是無法直接改變子組件的數(shù)據(jù)的。

失魂人 回答

把 on 加個(gè) '' 包起來 不然on 是個(gè)變量

瘋浪 回答

為了不污染變量呀。
如果不用立即執(zhí)行函數(shù)的話,var instance 就造成變量名污染了。

原生的組件系統(tǒng)非常難用,功能劃分很困難.
而vue的組件系統(tǒng)個(gè)人認(rèn)為是最成功,完成度最高的.非常值得借chao鑒xi

硬扛 回答

apply的文檔;

第二個(gè)參數(shù):argsArray
一個(gè)數(shù)組或者類數(shù)組對(duì)象,其中的數(shù)組元素將作為單獨(dú)的參數(shù)傳給 fun 函數(shù)。如果該參數(shù)的值為null 或 undefined,則表示不需要傳入任何參數(shù)。從ECMAScript 5 開始可以使用類數(shù)組對(duì)象。

所以

let a = [1,2,3],b=[4,5,6];
a.push.apply(a,b);

實(shí)質(zhì)上會(huì)將b中三個(gè)元素4,5,6當(dāng)作a.push的參數(shù),這里的a不是apply左邊的a,而是傳給apply的第一個(gè)參數(shù)。換句話說,apply會(huì)將第二個(gè)類數(shù)組參數(shù)拆分成一個(gè)個(gè)單獨(dú)項(xiàng)。
而與之對(duì)應(yīng)的有個(gè)call方法。

let a = [1,2,3];
a.push.call(a,4,5,6);

雖然支持超過2個(gè)參數(shù),但需要將參數(shù)都列出來,在數(shù)組操作上比apply要弱上許多。

夏夕 回答

就是普通的對(duì)數(shù)組重排吧。。

舊言 回答

你是想用Math.max找出數(shù)組中最大的數(shù)吧
應(yīng)該這樣寫

var arr = [1,2,3,45,66]
var num = Math.max.apply( null, arr );
console.log( num );

apply的第二個(gè)參數(shù)是參數(shù)數(shù)組

如果按照你那樣寫,用arr.join(','),得到的是字符串,就相當(dāng)于

Math.max( '1,2,3,45,66' );

里面是字符串,肯定是不對(duì)的

如果堅(jiān)持要用字符串拼接參數(shù),可以用eval

var arr = [1,2,3,45,66]
var num = eval( 'Math.max(' + arr.join( ',' ) + ')' );
console.log( num );    // 66

再補(bǔ)充一個(gè)ES6的寫法

var arr = [1,2,3,45,66]
var num = Math.max( ...arr );
console.log( num );    // 66
兔寶寶 回答

npm uninstall webpack --save-dev
npm install webpack@3.6.0 --save-dev
我是使用3.6的版本解決了

舊酒館 回答

先猜測(cè)下你的問提,你的問題場(chǎng)景可能如下:

  1. 你通過webpack構(gòu)建react項(xiàng)目,同時(shí)利用webpack提供的工具啟動(dòng)了一個(gè)本地的server,這樣你就可以通過類似下面的鏈接訪問你的頁(yè)面了 http://localhost:3000/index.html
  2. 現(xiàn)在你想在你用react構(gòu)建的頁(yè)面中,使用ajax去請(qǐng)求一個(gè)別的服務(wù)上的api,例如 https://api.github.com/users/whatever?client_id=xxxx&client_secret=yyyy

如果我沒猜錯(cuò)的話,你需要完成下面2件事情

  1. 在自己的代碼中編寫ajax請(qǐng)求,這里以 isomorphic-fetch進(jìn)行代碼示例

    import Fetch from 'isomorphic-fetch';
    
    Fetch('https://api.github.com/users/whatever?client_id=xxxx&client_secret=yyyy')
    .then(data=>{
      // 業(yè)務(wù)代碼
    })
    .catch(err=>{
      // 異常處理
    })
  2. 如果對(duì)應(yīng)的api做了跨域的處理,那么就不需要而外設(shè)置,如果沒有需要使用webpack提供的webpack-dev-server中的代理設(shè)置,示例代碼如下

    // webpack.config.js
    
    devServer:{
       proxy:{
         '/xx':{
           target:"",
           changeOrigin: true,
           pathRewrite: {
              '^/xx': ''
            }
         }
       }
    }

希望上面的偽代碼能幫到你,另外相關(guān)的資源如下:

  1. isomorphic-fetch
  2. webpack-dev-server