发表于
字数统计: 344 字 | 阅读时长 ≈ 2 min

ant design vue customRow 不起作用

ant design vue 网站中的实例
https://www.antdv.com/components/table-cn/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<Table
  customRow={(record) => {
    return {
      props: {
        xxx... //属性
      },
      on: { // 事件
        click: (event) => {},       // 点击行
        dblclick: (event) => {},
        contextmenu: (event) => {},
        mouseenter: (event) => {},  // 鼠标移入行
        mouseleave: (event) => {}
      },

    };
  )}
  customHeaderRow={(column) => {
    return {
      on: {
        click: () => {},        // 点击表头行
      }
    };
  )}
/>

线上网友一般使用的方式(还是不生效，或许因为vue版本不同，或者其他环境问题)

html代码：customRow绑定一个click方法，名字自己可以随便起

1
2
3
4
<a-table
              :columns="columns"
              :data-source="data"
              :customRow='click'>

js代码：

1
2
3
4
5
6
7
8
9
10
11
methods： {
  click(record, index) {
  		return {
     		on: {
        		dblclick: () => {
          			console.log(record);
        		}
     		}
  		}
  }
}

​ 在js中的methods中创建方法click(record, index)。record与index 分别是该行的数据(可以获取到放在data-source中的所有属性，即使没有在表格中呈现出来的也可以获取到）和该行数据在表格中的下标。

​ 通过上面的写法，我可以在双击表格某一行的时候，打印出这一行所绑定的data的全部内容。

实际项目使用

1
2
3
4
5
6
<a-table
  :columns="columns"
  :data-source="data"
  :customRow='click'>
 
```

methods： {
click:function(row,rowIndex){
const thisSelf = this;
return {
onClick: () => {
console.log(row, rowIndex)
if(row.btyAccountingSubjectCode ==”1012”||row.btyAccountingSubjectCode ==”1131”||row.btyAccountingSubjectCode ==”2121”){
thisSelf.openBtyAssistAccountingBalanceInit(row);
}
}
};
/**

  • 打开点击详情界面
    */
    openBtyAssistAccountingBalanceInit(row) {
    this.showBtyAssistAccountingBalanceInitParam = row;
    this.showBtyAssistAccountingBalanceInit = true;
    },
    }

```

发表于
字数统计: 895 字 | 阅读时长 ≈ 4 min

vue嵌套iframe一系列问题

最近在项目中遇到一个需求需要在一个项目中直接引用另一个项目，尝试各种情况无果后选择了iframe。现将调用过程中遇到的问题做一个分享。

router.go()的使用
  此情况主要适用于更改iframe中src值以后导致的路由跳转混乱。

  详细描述：当多次更改iframe->src属性后，调用router.go(-1)，不能实现路由后退上一级，而是将iframe当作一个窗口文档，调用了该窗口文档的window.history.go(-1)，并未更改父级项目的路由后退功能。

  解决办法：

  不通过改变iframe->src属性值去访问具体内容，采用window.location.replace(url)更改iframe将访问的内容，具体代码如下：
A.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<template>
  <iframe ref="iframe" scrolling="auto" width="100%" height="100%" frameborder="0" ></iframe>
</template>
<script>
export default {
  name: 'ComponentsName',
  data() {
    return {
      url: ''
    }
  },
  watch: {
    url(val) {
      if (val) {
        this.$refs.iframe.contentWindow.location.replace(val)
      }
    }
  }
}
</script>

注意ref=”iframe” 中iframe,的名字若在多个页面情况下，建议用不同的名称，不然打包之后会报错
this.$refs.iframe.contentWindow.location.replace(val) 同样也需要修改

通信（父页面和子页面相互通信）

  两个项目之间相互通信，涉及到跨域问题，子页面不能直接调用父页面的方法，父页面同样不能调用子页面的方法。

  错误详情：Error in created hook: “SecurityError: Blocked a frame with origin “http://*” from accessing a cross-origin frame.”

  解决办法： postMessage

  window.postMessage() 方法可以安全地实现跨源通信。该方法被调用时，会在所有页面脚本执行完毕之后向目标窗口派发一个MessageEvent消息。代码如下：

index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
<head>
  <title>Post Message</title>
</head>
<body>
  <div>
    <div id="color">Frame Color</div>
  </div>
  <div>
    <iframe id="child" width="50%" src="http://172.16.110.188/test.html" height="50vw" scrolling="auto" frameborder="0"></iframe>
  </div>
  <script type="text/javascript">
    window.onload=function(){
      document.getElementById('child').contentWindow.postMessage('getcolor','http://172.16.110.188');
    }
    window.addEventListener('message',function(e){
      var color=e.data;
      document.getElementById('color').style.backgroundColor=color;
    },false);
  </script>
</body>
</html>

test.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!doctype html>
<html>
<head>
  <style type="text/css">
    html,body{
      height:100%;
      margin:0px;
    }
    #container{
      widht:100%;
      height:100%;
      background-color:rgb(204, 102, 0);
    }
  </style>
</head>
<body style="height:100%;">
  <div id="container" onclick="changeColor();">
    click to change color
  </div>
  <script type="text/javascript">
    var container=document.getElementById('container');
    window.addEventListener('message',function(e){
      if(e.source!=window.parent) return;
      var color=container.style.backgroundColor;
      window.parent.postMessage(color,'*');
    },false);
    function changeColor () {            
      var color=container.style.backgroundColor;
      if(color=='rgb(204, 102, 0)'){
          color='rgb(204, 204, 0)';
      }else{
          color='rgb(204,102,0)';
      }
      container.style.backgroundColor=color;
      window.parent.postMessage(color,'*');
    }
  </script>
</body>
</html>

上面的例子实现了两个不同域的页面之间的通信。但由于我们此处用的是动态更改iframe.contentWindow.location来访问的内容，如果此处父页面要向子页面发起通信需要在iframe中页面加载完毕以后，不然子页面无法获取到通信数据。

应用场景
子页面需要调用父页面的方法或则使用父页面的数据时候，我们可以在子页面向父页面发起通信，让父页面调用该方法，或让父页面将数据传输过来。

注意事项
  postMessage支持对象传递，但不是所有浏览器都支持对象传递，在使用中还是使用字符串传值更好。

发表于
字数统计: 237 字 | 阅读时长 ≈ 1 min

1.nginx 报错

1
[warn] 19#19: *23 an upstream response is buffered to a temporary file /var/

2.解决

在nginx.conf 的http 里加入如下一段得到解决

1
2
3
4
fastcgi_buffer_size 128k;
fastcgi_buffers 8 128k;
fastcgi_busy_buffers_size 128k;
fastcgi_temp_file_write_size 128k;

另，如果nginx以proxy模式运行，则需更改上面一段为如下内容：

1
2
3
4
proxy_buffer_size 128k;
proxy_buffers 8 128k;
proxy_busy_buffers_size 128k;
proxy_temp_file_write_size 128k;

注意：很多网上教程 fastcgi_buffers 8 128k;忘记加k ,这个会造成 [emerg] 1#1: “fastcgi_busy_buffers_size” must be less than the size of all “fastcgi_buffers”

完整nginx.conf配置如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
# nginx.conf 例：
user  nginx;
worker_processes  1;
 
error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;
 
 
events {
    worker_connections  1024;
}
 
 
http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;
 
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';
 
    access_log  /var/log/nginx/access.log  main;
 
    sendfile        on;
    #tcp_nopush     on;
 
    keepalive_timeout  65;
 
    #gzip  on;
 
   fastcgi_buffer_size 128k;
   fastcgi_buffers 8 128;
   fastcgi_busy_buffers_size 128k;
   fastcgi_temp_file_write_size 128k;
  
    include /etc/nginx/conf.d/*.conf;
}

发表于
字数统计: 226 字 | 阅读时长 ≈ 1 min

1.修改配置

在vue项目的根目录config/index.js中找build->assetsPublicPath 将”/“ 配置为”/test/“

1
2
3
build: {
  // assetsPublicPath: '/',
  assetsPublicPath: '/test/',

2.打包

vue 打包命令，在vue项目的根目录执行，生成dist 文件夹

1
npm run dev

3.部署子项目

将打包好的dist 放到子项目的nginx的html文件夹，并且重命名为test
子项目的nginx 配置如下

1
2
3
4
5
6
7
8
9
10
11
server {
    listen       8080;
    server_name  localhost;
    charset utf-8; 
    # rewrite ^(.*)$  https://www.vhxsl.com permanent;

    location / {
       root   /usr/share/nginx/html;
       index  index.html index.htm;
    }
 }

重启nginx
此时可测试子项目的nginx 是否可以看 http://127.0.0.1:8080/test

4.部署主项目

修改主nginx 的配置

1
2
3
4
5
6
location /test{
  try_files $uri @test;
}
location @test{
    proxy_pass http://127.0.0.1:8081$uri;
}

重启nginx
这样访问 主项目的http://127.0.0.1:80/test 就会跳转到子项目的 http://127.0.0.1:8080/test

发表于
字数统计: 189 字 | 阅读时长 ≈ 1 min

步骤

1
2
3
4
5
6
7
8
9
10
11
12
DriverManager.registerDriver (new oracle.jdbc.driver.OracleDriver());
Connection conn = DriverManager.getConnection(
  "jdbc:oracle:thin:@<server>:1521:<sid>", <username>, <password>);

DatabaseMetaData meta = conn.getMetaData();
ResultSet columns = meta.getColumns(null, null, "EMPLOYEES", null);
int i = 1;
while (columns.next())
{
  System.out.printf("%d: %s (%d)\n", i++, columns.getString("COLUMN_NAME"), 
    columns.getInt("ORDINAL_POSITION"));
}
1
2
3
4
5
6
7
8
ResultSet中包含着一套复制所有的列，即每列返回两次。 下面是我得到的输出：

1: ID (1)
2: NAME (2)
3: CITY (3)
4: ID (1)
5: NAME (2)
6: CITY (3)

解决办法，用数组判断列名，防止重复列

1
2
3
4
5
6
7
8
9
10
11
//这里是为了防止获取重复的列；
List<String> fieldList = new ArrayList<>();
if(fieldList.size()>0){
    for (String field:fieldList){
        String COLUM = resultSet.getString("COLUMN_NAME");
        String colum = StringUtils.underScoreCase2CamelCase((COLUM.toLowerCase()));
        if(colum.equals(field)){
            return;
        }
    }
}

发表于
字数统计: 159 字 | 阅读时长 ≈ 1 min

步骤

1.下载本地zip文件，下载地址：https://plugins.jetbrains.com/plugin/10046-alibaba-java-coding-guidelines

注意：选择适合自己idea版本的插件，版本不合适，不兼容

2.打开IDEA，File-> Setteings->Plugins->Install plugin from disk,
选择刚才自己下载插件zip包的地址，（最好存放的目录路径全英文），之后点击OK。之后回到主界面弹出重启的按钮，点击重启

使用

右击项目，选择编码规约扫描，扫描出不符合代码规范的内容就在idea的下面显示了

准备

阿里规范插件GitHub地址：https://github.com/alibaba/p3c

发表于
字数统计: 73 字 | 阅读时长 ≈ 1 min

正文

【sqlserver】：

sqlserver 认为 null 最小。

升序排列：null 值默认排在最前。

要想排后面，则：order by case when col is null then 1 else 0 end ,col

降序排列：null 值默认排在最后。

要想排在前面，则：order by case when col is null then 0 else 1 end , col desc

发表于
字数统计: 385 字 | 阅读时长 ≈ 1 min

正文

型号：PT924G
软件版本号：V10.00.924JX02
硬件版本 V4.0.00
因为光猫路由器用久了，网络太慢了，所以想接路由器。
后面发现此神坑，一路坎坷就不赘述。
此贴主要记录个人路由器cfg设置文件的获取方式，如果看不懂我在说什么就不用看下去了。
登入方式不是192.168.1.1登入链接为下面这个
http://192.168.1.1:8080/cgi-bin/index2.asp
登入界面不再是你熟悉的那个界面，是：我的E家
旁边登入的账号密码就是你平时登入路由器后台的账号密码，然后进入到管理员界面就后台挂着不用管了，打开新的网页输入

http://192.168.1.1:8080/romfile.cfg
这样就会自动弹出下载页面。(此处建议用谷歌浏览器，左下角会提示危险是否保留，当然选择保留！！！)
PS：有些不同地区，软件版本，硬件版本和型号的登入方式不同，要是此办法不行可以192.168.1.1到后台在输入cfg的网址下载，还不行可以试试以下cfg下载网址
http192.168.1.1/backup/settings.conf
http192.168.1.1/romfile.cfg

光猫改桥接模式

网络-》宽带设置

选择第二个(2_INTERNET_B_VID_41)
模式选择桥接（Bridge）
点击确定

网络-》Qos
Qos 选择关闭 （！！！ 此处很重要，不然路由器用账号密码链接之后不久将自动断掉）