Write the Code. Change the World.

8月 02

在某些场景下,需要对区域进行首字母排序。不仅要提取出地区的首字母,并且还要对相同首字母的地区也进行排序。

开始

首先,我们有这样的一些数据:

var cityData = [
    [
        {
            "label":"北京市",
            "value":1101
        }
    ],
    [
        {
            "label":"天津市",
            "value":1201
        }
    ],
    [
        {
            "label":"石家庄",
            "value":1301
        },
        {
            "label":"唐山",
            "value":1302
        },
        {
            "label":"秦皇岛",
            "value":1303
        }
    ]
]

这是一个二维数组,可以先把它弄成一维数组。然后通过 pinyin.js 取出每个 label 的首字母,并且有相同首字母的数据放在同一个数组里。然后进行二次排序。这里在 pinyin.js 中新增加了一个 getFirstChar 方法。

    /**
     * 获取整个词汇的首字母
     * @param {String} str 输入的中文字符串
     */
    getFirstChar(str) {
        if (typeof(str) != "string")
            throw new Error(-1, "函数getCamelChars需要字符串类型参数!");

        if (!str) {
            throw new Error(-1, "不能是空字符串");
        }

        str = str.substr(0, 1);
        return this._getChar(str);
    }

计算如下。

import Pinyin from '../../../static/js/pinyin.js';

let pinyin = new Pinyin();

let temp = {};
let keys = [];
for(let item1 of city) {
    for(let item2 of item1) {
        if (item2.label == '直辖市') {
            continue;
        }

        let fc = pinyin.getFirstChar(item2.label);
        if (temp[fc]) {
            temp[fc].push(item2);
        } else {
            keys.push(fc);
            temp[fc] = [item2];
        }
    }
}
keys = keys.sort();

let list = [{
     title: '热门',
     letter: 'hot',
     value: []
}]

function sortItem(item1, item2) {
    return item1['label'].localeCompare(item2['label']);
}

for(let key of keys) {
    list.push({
        title: key,
        letter: key,
        value: temp[key].sort(sortItem)
    });
}

参考类库

https://github.com/waterchestnut/pinyin

https://www.w3school.com.cn/js/jsref_localeCompare.asp

阅读全文 >>

8月 01

在 uniapp 中,如果 view 定义了 display:flex ,那么 v-show 就无效了。也就是总是 true,总是会显示出来。

阅读全文 >>

7月 27

想要在小程序中使用区域聚合很不好搞啊。单纯的聚合,腾讯地图小程序就已经支持。可是区域聚合貌似只有高德有。

聚合

高德区划聚合
https://developer.amap.com/demo/amap-ui/demos/amap-ui-districtcluster/top-adcodes

https://developer.amap.com/api/amap-ui/reference-amap-ui/geo/district-cluster

微信聚合
https://developers.weixin.qq.com/miniprogram/dev/api/media/map/MapContext.initMarkerCluster.html

https://developers.weixin.qq.com/miniprogram/dev/component/map.html

高德难言
https://developer.amap.com/faq/other-interface/amap-applets/create-project/66485

既然不支持,又想搞怎么办呢。自己写算法,实现 market 的调整。这个时候,大家就要齐心。放大到一定比例展示省级别,再放大到一定比例显示市级别,再放到一定比列显示县级别,再放到一定比例显示镇级别。就以镇为最小单位,把每个镇里相关的数据放在一个数组里,镇的放在县里依次到省,全国。这样似乎就失去了腾讯地图聚合的初衷了。 地图有 initMarkerCluster 方法和 markerClusterCreate 时间,不用可惜啊。

阅读全文 >>

7月 19

As you may know, this year we updated the Laravel release cycle to include one major release per year. Previously, we released two major versions per year.

These release changes would typically indicate that a Laravel 9 release is due in September of this year. However, as you may know, Laravel uses a variety of community-driven packages as well as nine Symfony components for a number of features within the framework. Symfony 6.0 is due for release in November. For that reason, we are choosing to delay the Laravel 9.0 release until January 2022.

By delaying the release, we can upgrade our underlying Symfony components to Symfony 6.0 without being forced to wait until September 2022 to perform this upgrade. In addition, this better positions us for future releases as our yearly releases will always take place two months after Symfony's releases. This means that the upcoming Laravel release schedule will look as follows:

Laravel 9.0: January 2022
Laravel 10.0: January 2023
Laravel 11.0: January 2024
We are continuing to deliver exciting new improvements to the Laravel 8.x release series. In fact, we have been able to ship a variety of amazing new features without needing a major release, including parallel testing, model broadcasting improvements, and more. We look forward to shipping even more wonderful improvements to you soon!

原文

https://blog.laravel.com/laravel-9-release-date

阅读全文 >>

7月 16

步骤

  1. 新建空目录。 zz.com
  2. 进 zz.com。 新建 composer.json 文件。并填充内容。
{
  "require": {
    "jonnyw/php-phantomjs": "4.*"
  }
}
  1. 执行 composer.update 。
  2. 建立 git 和 .gitignore 忽略文件
git init
.gitignore 中填充 /vendor
git add .
git commit -m '新建 composer.json 文件,配置安装 jonnyw/php-phantomjs'
  1. 新建路由以及配置自动加载。

参考

https://learnku.com/laravel/t/3590/php-crawls-the-page-that-needs-to-run-js-run-js-grabing-web-page-with-php-while

https://blog.junphp.com/details/391.jsp

https://blog.csdn.net/luyaran/article/details/53836486

阅读全文 >>

7月 16

随着苹果 8 以后的手机等出现,顶部,底部自适应问题是手机应用(app,web,小程序)要解决的问题。对于网页和小程序可以使用 env(safe-area-inset-bottom) 等解决。

env()和constant(),是IOS11新增特性,Webkit的css函数,用于设定安全区域与边界的距离,有4个预定义变量:

  • safe-area-inset-left:安全区域距离左边边界的距离
  • safe-area-inset-right:安全区域距离右边边界的距离
  • safe-area-inset-top:安全区域距离顶部边界的距离
  • safe-area-inset-bottom :安全距离底部边界的距离

而env()和constant()函数有个必要的使用前提,H5网页设置viewport-fit=cover的时候才生效,小程序里的viewport-fit默认是cover。

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">

适配底部代码:

height: calc(96rpx+ constant(safe-area-inset-bottom));//兼容 IOS<11.2

height: calc(96rpx + env(safe-area-inset-bottom));//兼容 IOS>11.2

padding-bottom: constant(safe-area-inset-bottom);//兼容 IOS<11.2

padding-bottom: env(safe-area-inset-bottom);//兼容 IOS>11.2


// 先constant再env

文章来源第二个有说到兼容性问题。

文章来源

https://www.cnblogs.com/djjlovedjj/p/13983852.html

https://www.cnblogs.com/djjlovedjj/p/14686684.html

阅读全文 >>

7月 09

Text(
    '给我一个理由忘记',
    overflow: TextOverflow.ellipsis,
    maxLines: 2,
    style: TextStyle(
        fontSize: 13.0
    ),
)

在某些场景下无法换行,请用 Expanded

Expanded (
    child: Text(
        '给我一个理由忘记',
        overflow: TextOverflow.ellipsis,
        maxLines: 2,
        style: TextStyle(
            fontSize: 13.0
        ),
    )
)

也可以套 Container ,设置宽度来限制文本的宽度。

阅读全文 >>

7月 09

准备

https://github.com/FriendsOfPHP/Goutte

https://github.com/guzzle/guzzle

https://guzzle-cn.readthedocs.io/zh_CN/latest/request-options.html

安装

composer require fabpot/goutte

composer require guzzlehttp/guzzle

试试

先看看 goutte

use Goutte\Client;

$client = new Client();
$crawler = $client->request('GET', 'https://www.yuepaibao.com/moments');
$crawler->filter('.content span')->each(function ($node) {
print $node->text()."\n";
});

**再看看 GuzzleHttp **

use GuzzleHttp\Client as GoutteClient;
use GuzzleHttp\Psr7\Request as GuzzleRequest;

$url = 'https://www.hao123.com';
$request = new GuzzleRequest('GET', $url);
$client = new GoutteClient();
$response = $client->send($request, ['timeout' => 5]);
$content = $response->getBody()->getContents();
echo $content;

特殊

https://learnku.com/laravel/t/3590/php-crawls-the-page-that-needs-to-run-js-run-js-grabing-web-page-with-php-while

阅读全文 >>

6月 18

领离药房

https://github.com/vjiedan/shwinking.git

万敬
https://github.com/vjiedan/shwinking.git

高锶
git@gitlab.com:vinish/gaosi.com.git

ssl 证书
https://github.com/prispace/sslcer.git

溯源码
https://github.com/vjiedan/suyuanma.git

约拍宝-v2服务端
https://gitlab.com/vinish/yuepaibao.git

约拍宝-v1服务端
https://gitlab.com/yuepaibao/www.yuepaibao.com.git

阅读全文 >>