讲这个以前先以一个例子作为展开。lwc的 superbadge中有一个功能为 左侧 Gallery列表中点击一个图片，在右侧 details会展示这个船的详细信息。

以往我们可能想着，简单，将这两部分组成到同一个父组件中，Gallery中的某个item点击以后，传递一个事件到父，父进行handler处理以后，将record id 传递给右侧的组件，右侧组件这个reRender一下就搞定了。

先说一下上面的分析能不能实现？ 能，而且肯定能。因为事件的传播以后，父组件是肯定可以监听到，监听到处理到，变量绑定到其他的子可以实现。那这样好不好呢？

老实地说，好与不好不清楚，因为项目上更关注三点：

1. 稳定性

2. 性能

3. 可扩展性

这种方式这三点应该都没有太大的问题，问题在于当需求变动以后，父 组件里的逻辑将可能会越来越多。父组件我们的初衷可能是套个壳子，让他们有亲戚关系进行简单的信息交换，结果爸爸需求可能越来越多最后可能承受不能承受之重。

有没有其他的方式去实现即使两个组件没有关系，但是也可以做到信息之间的传递呢？今天的 Lightning Message Service便可以实现这个需求。

一. Lightning Message Service

Lightning Message Service用于在 VF Page, Aura Component, lwc之间进行跨DOM 通讯。可以在单一的 lightning page或者是多个page之间进行通讯。操作的步骤为发布订阅原则。听到发布订阅，大家可能想到 Streaming API 或者是 Platform Event， salesforce针对不同的通讯场景有多种的广播订阅模型进行选择，页面之间的跨DOM通讯使用 Lightning Message Service。值得注意的是，在 spring 20的时候这个功能还是一个 beta版本，在现在的 summer20已经是一个正式的功能，所以可以放心使用。 Lightning Message Service的特别的细节的介绍以及limitation还请参看上面的链接，接下来讲一下具体的使用步骤。

1. 创建 Message Channel

我们在vs code项目的目录中查看是否有messageChannels这个目录，如果不包含就手动创建一下。新建一个以messageChannel-meta.xml 结尾的文件即可。篇中demo创建的是 BoatMessageChannel.messageChannel-meta.xml。进行相关的信息填充以后保存到环境即可。如果曾经有创建过，需要从sandbox或者developer环境导入下来，执行 sfdx force:source:retrieve -m LightningMessageChannel即可retrieve下来。

那这个xml应该如何写呢？这个时候就需要看 salesforce的 metadata api关于 LightningMessageChannel的介绍：https://developer.salesforce.com/docs/atlas.en-us.api_meta.meta/api_meta/meta_lightningmessagechannel.htm

lightning message channel包括以下的几部分构成：

description：lightning message channel的描述信息；
isExposed：标签指定当前的 lightning message channel是否暴露出来，类似我们做 lwc的metadata xml的配置；
masterLabel： lightning message channel的label名称，这个属性是一个必填字段；
lightningMessageFields：这个是 lightning message channel的核心属性，通过这个负载字段用来声明广播订阅接收的变量信息。针对这个属性有两个子属性。description用来描述 lightningMessageField的描述信息，fieldName用来描述当前 lightningMessageField要传播的字段的api name。
下面的xml是BoatMessageChannel的全的信息，以便更好的了解 lightning message channel。sample中我们声明了一个fieldName为recordId的名称是 BoatMessageChannel的 lightning message channel信息。如果需要传递多个变量，只需要多写几个 即可。

复制代码

<?xml version="1.0" encoding="UTF-8"?>This is a sample Lightning Message Channel for the Lightning Web Components Superbadge.trueThis is the record Id that changedrecordIdBoatMessageChannel复制代码 2. 定义Lightning Message Service的作用域

广播订阅机制一个另外的重要的事情就是作用域的问题，即哪种情况订阅者可以订阅到广播源发送的消息。是整个应用级别，还是某些active区域。如果我们在lwc组件间进行广播订阅时，一定要写上@wire(MessageContext)去让scope特性可用。下图为订阅的scope的模型。salesforce默认的订阅模型的scope范围是active的，如果我们希望订阅范围扩大，需要lwc component头部引入APPLICATION_SCOPE，这个是在 ‘lightning/messageService’中。项目中没有要求指定哪种scope，如果有要求即使在Hidden的tab中也可以接收到相关的订阅消息并进行什么处理，可以设置成整个应用级别，篇中demo设置的即应用级别。

3. 广播一个message Channel

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reference_salesforce_modules

我们在广播或者订阅以前都需要先引入我们创建的 message channel，使用 @salesforce/messageChannel进行引用，如果是包里的内容，需要添加namespace信息，如果不是包里的，直接使用channelReference即可。channelReference需要以 __c结尾，这个是强制的要求。

import channelName from ‘@salesforce/messageChannel/namespace__channelReference’;
所以我们篇中的demo中的 messageChannel名称为BoatMessageChannel，所以引入信息如下，其中 BOATMC的名字任意起，messageChannel以__c结尾。

import BOATMC from ‘@salesforce/messageChannel/BoatMessageChannel__c’;
引入以后我们进行发布操作，lightning/messageService包含了 publish方法，我们在发布以前也需要在头部以前引入，因为lwc需要强制使用 MessageContext让scope可用，这里也一并引入 MessageContext

import { publish, MessageContext } from ‘lightning/messageService’;
上面的准备工作完成以后，只需要调用publish方法即可实现发布。publish有以下的几个参数需要传递。

messageContext: messageContext，这里默认填写我们使用wire方法获取声明的变量即可。
messageChannel：头部声明的 messageChannel的引用变量；
message：一个序列化的JSON object信息，根据messageChannel的字段设置去填充这个字段即可。
下面有一个简单的publish代码块进行更好的了解。如果我们在 BOATMC中声明了两个变量，一个是 recordId，一个是recordData，则我们的 publish方法包含这三部分即可。

复制代码
@wire(MessageContext)
messageContext;

handleClick() {const message = {recordId: '001xx000003NGSFAA4',recordData: {accountName: 'Burlington Textiles Corp of America'}};publish(this.messageContext, BOATMC, message);
}

复制代码
4. 订阅 messageChannel

广播源广播出去一个以后，订阅的component如何订阅呢？如果小伙伴先仔细查看上面的连接以后发现在 lightning/messageService里面同样封装了一个用来订阅的方法：subscribe，如果想要取消订阅，只需要调用unsubscribe()即可。

同样的操作，第一个步骤，需要先引入 MessageContext,这里不做重复的描述。直接描述一下 subscribe方法，里面有4个参数。

messageContext：描述同上；
messageChannel：描述同上；
listener：一个函数用来当发布以后处理message用；
subscriberOptions：这个是一个可选操作，当我们指定从APPLICATION级别接收消息情况下，设置成{scope: APPLICATION_SCOPE}，如果APPLICATION级别，头部需要从lightning/messageService引入APPLICATION_SCOPE。
APPLICATION_SCOPE级别的sample，用于当订阅以后，调用 handleMessage去处理具体订阅逻辑， message.fieldName即可取出相关的值，比如message.recordId即可以取出 发布时 recordId这个变量对应的值。

复制代码
this.subscription = subscribe(
this.messageContext,
BOATMC,
(message) => {
this.handleMessage(message);
},
{ scope: APPLICATION_SCOPE }
);
复制代码
active级别的sample：只需要将最后一个参数 scope信息删除即可。

复制代码
this.subscription = subscribe(
this.messageContext,
BOATMC,
(message) => {
this.handleMessage(message);
}
);
复制代码
unsubscription这里不在介绍，看一下上面的文档以及参数介绍大家便可以进行正常的学习。

二. 代码实现

我们在第一部分已经介绍了 Lightning Message Service的基础知识以及方法的使用，下面的内容通过demo可以更好的去学习以及理解。

1. 创建 Message Channel，这里步骤同上面，创建了一个BoatMessageChannel 的 Message Channel，设置了一个 recordId的变量

2. 广播操作

BoatDataService.cls：这里对代码进行了删减，只保留了这次demo用到的方法，通过 getBoats获取船的数据列表信息3.

复制代码
public with sharing class BoatDataService {

public static final String LENGTH_TYPE = 'Length'; 
public static final String PRICE_TYPE = 'Price'; 
public static final String TYPE_TYPE = 'Type'; 
@AuraEnabled(cacheable=true)
public static List<Boat__c> getBoats(String boatTypeId) {// Without an explicit boatTypeId, the full list is desiredString query = 'SELECT '+ 'Name, Description__c, Geolocation__Latitude__s, '+ 'Geolocation__Longitude__s, Picture__c, Contact__r.Name, '+ 'BoatType__c, BoatType__r.Name, Length__c, Price__c '+ 'FROM Boat__c';if (String.isNotBlank(boatTypeId)) {query += ' WHERE BoatType__c = :boatTypeId';}query += ' WITH SECURITY_ENFORCED ';return Database.query(query);
}@AuraEnabled(cacheable=true)
public static List<Boat__c> getSimilarBoats(Id boatId, String similarBy) {List<Boat__c> similarBoats = new List<Boat__c>();List<Boat__c> parentBoat = [SELECT Id, Length__c, Price__c, BoatType__c, BoatType__r.NameFROM Boat__cWHERE Id = :boatId WITH SECURITY_ENFORCED];if (parentBoat.isEmpty()) {return similarBoats;}if (similarBy == LENGTH_TYPE) {similarBoats = [SELECT Id, Contact__r.Name, Name, BoatType__c, BoatType__r.Name, Length__c, Picture__c, Price__c, Year_Built__cFROM Boat__cWHERE Id != :parentBoat.get(0).IdAND (Length__c >= :parentBoat.get(0).Length__c / 1.2)AND (Length__c <= :parentBoat.get(0).Length__c * 1.2)WITH SECURITY_ENFORCEDORDER BY Length__c, Price__c, Year_Built__c];} else if (similarBy == PRICE_TYPE) {similarBoats = [SELECT Id, Contact__r.Name, Name, BoatType__c, BoatType__r.Name, Length__c, Picture__c, Price__c, Year_Built__cFROM Boat__cWHERE Id != :parentBoat.get(0).IdAND (Price__c >= :parentBoat.get(0).Price__c / 1.2)AND (Price__c <= :parentBoat.get(0).Price__c * 1.2)WITH SECURITY_ENFORCEDORDER BY Price__c, Length__c, Year_Built__c];} else if (similarBy == TYPE_TYPE) {similarBoats = [SELECT Id, Contact__r.Name, Name, BoatType__c, BoatType__r.Name, Length__c, Picture__c, Price__c, Year_Built__cFROM Boat__cWHERE Id != :parentBoat.get(0).IdAND (BoatType__c = :parentBoat.get(0).BoatType__c)WITH SECURITY_ENFORCEDORDER BY Price__c, Length__c, Year_Built__c];}return similarBoats;
}

}
复制代码
boatSearchResults.html：使用 layout方式展示一些数据

复制代码

复制代码
boatSearchResults.js：这里我们可以看到，首先头部引入了 MessageChannel 以及使用了 MessageContext以及 publish方法，下面的方法中使用了 publish方法去进行了广播操作

复制代码
import { LightningElement, wire, api, track } from ‘lwc’;
import getBoats from ‘@salesforce/apex/BoatDataService.getBoats’;
import { publish, MessageContext } from ‘lightning/messageService’;
import BoatMC from ‘@salesforce/messageChannel/BoatMessageChannel__c’;

export default class BoatSearchResults extends LightningElement {
boatTypeId = ‘’;
@track boats;
@track draftValues = [];
selectedBoatId = ‘’;
isLoading = false;
error = undefined;
wiredBoatsResult;

@wire(MessageContext) messageContext;columns = [{ label: 'Name', fieldName: 'Name', type: 'text', editable: 'true'  },{ label: 'Length', fieldName: 'Length__c', type: 'number', editable: 'true' },{ label: 'Price', fieldName: 'Price__c', type: 'currency', editable: 'true' },{ label: 'Description', fieldName: 'Description__c', type: 'text', editable: 'true' }
];@api
searchBoats(boatTypeId) {this.isLoading = true;this.notifyLoading(this.isLoading);this.boatTypeId = boatTypeId;
}@wire(getBoats, { boatTypeId: '$boatTypeId' })
wiredBoats(result) {this.boats = result;if (result.error) {this.error = result.error;this.boats = undefined;}this.isLoading = false;this.notifyLoading(this.isLoading);
}updateSelectedTile(event) {this.selectedBoatId = event.detail.boatId;this.sendMessageService(this.selectedBoatId);
}notifyLoading(isLoading) {if (isLoading) {this.dispatchEvent(new CustomEvent('loading'));} else {this.dispatchEvent(CustomEvent('doneloading'));}
}sendMessageService(boatId) { publish(this.messageContext, BoatMC, { recordId : boatId });
}

}
复制代码
boatTile.html：展示gallery中的每一个item的UI

复制代码

复制代码
boatTile.js：item点击以后调度事件，boatSearchResults这个父组件 handle事件，从而实现了广播的发布

复制代码
import { LightningElement, api} from “lwc”;
const TILE_WRAPPER_SELECTED_CLASS = “tile-wrapper selected”;
const TILE_WRAPPER_UNSELECTED_CLASS = “tile-wrapper”;
export default class BoatTile extends LightningElement {
@api boat;
@api selectedBoatId;
get backgroundStyle() {
return background-image:url(${this.boat.Picture__c});
}
get tileClass() {
return this.selectedBoatId == this.boat.Id ? TILE_WRAPPER_SELECTED_CLASS : TILE_WRAPPER_UNSELECTED_CLASS;
}
selectBoat() {
this.selectedBoatId = !this.selectedBoatId;
const boatselect = new CustomEvent(“boatselect”, {
detail: {
boatId: this.boat.Id
}
});
this.dispatchEvent(boatselect);
}
}
复制代码
3. 消息订阅

boatDetailTabs.html：用来展示发布过来的指定的记录的详细信息

复制代码




{label.labelPleaseSelectABoat}

     </lightning-tabset></lightning-card>

复制代码 boatDetailsTabs.js：connectedCallback生命周期函数中进行订阅操作，订阅到boatId的值，从而 getRecord展示左侧galery选择的数据的详情信息

复制代码
// Custom Labels Imports
// import labelDetails for Details
// import labelReviews for Reviews
// import labelAddReview for Add_Review
// import labelFullDetails for Full_Details
// import labelPleaseSelectABoat for Please_select_a_boat
// Boat__c Schema Imports
// import BOAT_ID_FIELD for the Boat Id
// import BOAT_NAME_FIELD for the boat Name
import { LightningElement, api,wire } from ‘lwc’;
import labelDetails from ‘@salesforce/label/c.Details’;
import labelReviews from ‘@salesforce/label/c.Reviews’;
import labelAddReview from ‘@salesforce/label/c.Add_Review’;
import labelFullDetails from ‘@salesforce/label/c.Full_Details’;
import labelPleaseSelectABoat from ‘@salesforce/label/c.Please_select_a_boat’;
import BOAT_ID_FIELD from ‘@salesforce/schema/Boat__c.Id’;
import BOAT_NAME_FIELD from ‘@salesforce/schema/Boat__c.Name’;
import { getRecord,getFieldValue } from ‘lightning/uiRecordApi’;
import BOATMC from ‘@salesforce/messageChannel/BoatMessageChannel__c’;
import { APPLICATION_SCOPE,MessageContext, subscribe } from ‘lightning/messageService’;
const BOAT_FIELDS = [BOAT_ID_FIELD, BOAT_NAME_FIELD];
import {NavigationMixin} from ‘lightning/navigation’;
export default class BoatDetailTabs extends NavigationMixin(LightningElement) {
@api boatId;

label = {
labelDetails,
labelReviews,
labelAddReview,
labelFullDetails,
labelPleaseSelectABoat,
};

// Decide when to show or hide the icon
// returns ‘utility:anchor’ or null
get detailsTabIconName() {
return this.wiredRecord && this.wiredRecord.data ? ‘utility:anchor’ : null;
}

// Utilize getFieldValue to extract the boat name from the record wire
@wire(getRecord,{recordId: ‘$boatId’, fields: BOAT_FIELDS})
wiredRecord;

get boatName() {
return getFieldValue(this.wiredRecord.data, BOAT_NAME_FIELD);
}

// Private
subscription = null;
// Initialize messageContext for Message Service
@wire(MessageContext)
messageContext;

// Subscribe to the message channel
subscribeMC() {
if(this.subscription) { return; }
// local boatId must receive the recordId from the message
this.subscription = subscribe(
this.messageContext,
BOATMC,
(message) => {
this.boatId = message.recordId;
},
{ scope: APPLICATION_SCOPE }
);
}

// Calls subscribeMC()
connectedCallback() {
this.subscribeMC();
}

}
复制代码
https://www.jianshu.com/c/0b5248f0544f
https://www.jianshu.com/c/7ca9cfa7b855
https://www.jianshu.com/c/3b4eaaccb1ee
https://www.jianshu.com/c/8bb6ef796975
https://www.jianshu.com/c/33eb8f8084da
https://www.jianshu.com/c/9787149fd37b
https://www.jianshu.com/c/fc80fb01b1a8
https://www.jianshu.com/c/f9f6f77fadc0
https://www.jianshu.com/c/8603d7f45fac
https://www.jianshu.com/c/44f726fb54cf
https://www.jianshu.com/c/89494144105b
https://www.jianshu.com/c/db547c3a9777
https://www.jianshu.com/c/e10c5afd134f
https://www.jianshu.com/c/76918f023183
https://www.jianshu.com/c/348b655e7c1f
https://www.jianshu.com/c/f04d39b5c5fb
https://www.jianshu.com/c/28a0ad37e2cc
https://www.jianshu.com/c/ff947625395d
https://www.jianshu.com/c/6d3a3d4cbe89
https://www.jianshu.com/c/b7071540c804
https://www.jianshu.com/c/87069c7f08b3
https://www.jianshu.com/c/1ef286749ec1
https://www.jianshu.com/c/f8d5edca59d6
https://www.jianshu.com/c/53121ab09e85
https://www.jianshu.com/c/98b986cb8a5e/
https://www.jianshu.com/c/d3f841beba7d/
https://www.jianshu.com/c/9a874dee65bd
https://www.jianshu.com/c/6edc3d7017f6/
https://www.jianshu.com/c/fa86c079cafe/
https://www.jianshu.com/c/bcc364c48125/
https://www.jianshu.com/c/ac2be8a9429c
https://www.jianshu.com/c/bd5a1b9bff00
https://www.jianshu.com/c/cb3ee9b57f3f
https://www.jianshu.com/c/19987b9c5233
https://www.jianshu.com/c/21551158125a
https://www.jianshu.com/c/14ff4ea39e41
https://www.jianshu.com/c/2536a82f31c9
https://www.jianshu.com/c/1515675cb97d
https://www.jianshu.com/c/b6fcbbaa0737
https://www.jianshu.com/c/883d3a88e68a
https://www.jianshu.com/c/f2a402318998
https://www.jianshu.com/c/1a57cbe315b3
https://www.jianshu.com/c/67cb210e5eba
https://www.jianshu.com/c/e6692738cab4
https://www.jianshu.com/c/3dd8a7bb628f
https://www.jianshu.com/c/41d63febf57b
https://www.jianshu.com/c/dcefef6617d2
https://www.jianshu.com/c/97f45041a5dd
https://www.jianshu.com/c/d24e42e1671e
https://www.jianshu.com/c/bd44f87799ed
https://www.jianshu.com/c/6a4a6cb72b2a
https://www.jianshu.com/c/c5a3ded4c241
https://www.jianshu.com/c/5535ad8f13f8
https://www.jianshu.com/c/afdeba77a16f
https://www.jianshu.com/c/578673c4d7f3
https://www.jianshu.com/c/b35f57225fe8
https://www.jianshu.com/c/fe917df2e408
https://www.jianshu.com/c/5379918a22cc
https://www.jianshu.com/c/21f7841dd864
https://www.jianshu.com/c/5f7413cb6ef5
https://www.jianshu.com/c/1d67591033ae
https://www.jianshu.com/c/50f758bac2f9
https://www.jianshu.com/c/c023303d215d
https://www.jianshu.com/c/0b9cf3c923ce
https://www.jianshu.com/c/cd55bceb9e32
https://www.jianshu.com/c/49237c3f3d15
https://www.jianshu.com/c/41058f9b8968
https://www.jianshu.com/c/21dbcf34c8fe
https://www.jianshu.com/c/c4b42b601551
https://www.jianshu.com/c/fc070b9b1dcb
https://www.jianshu.com/c/9b75d56858ec
https://www.jianshu.com/c/dd7c60dbf6cc
https://www.jianshu.com/c/80fa4a92ccde
https://www.jianshu.com/c/11ebb0c36c9f
https://www.jianshu.com/c/861486471201
https://www.jianshu.com/c/ff464b9571d7
https://www.jianshu.com/c/859dd7c814b8
https://www.jianshu.com/c/de848194cc73
https://www.jianshu.com/c/ad40c8cc40dc
https://www.jianshu.com/c/2145c92a5197
https://www.jianshu.com/c/9ee3cfd3b933
https://www.jianshu.com/c/e4726f95e49c
https://www.jianshu.com/c/0bc5bc3e308f
https://www.jianshu.com/c/9513866c221d
https://www.jianshu.com/c/789570ce1b6c
https://www.jianshu.com/c/86b54f79c4ff
https://www.jianshu.com/c/de47b9264ca6
https://www.jianshu.com/c/50e5a226945f
https://www.jianshu.com/c/9b178106bfd2
https://www.jianshu.com/c/3a1d04aa3728
https://www.jianshu.com/c/9c23406f23d5
https://www.jianshu.com/c/d46c28ee20cf
https://www.jianshu.com/c/bc7cee812593
https://www.jianshu.com/c/44c788456eb7
https://www.jianshu.com/c/d157d32922ba
https://www.jianshu.com/c/3d8f49346695
https://www.jianshu.com/c/51e71868b2f8
https://www.jianshu.com/c/060519cfb322
https://www.jianshu.com/c/cd43532b55c3
https://www.jianshu.com/c/24360093e6ca
https://www.jianshu.com/c/bc61965c7f20
https://www.jianshu.com/c/7e30cc16e4d0
https://www.jianshu.com/c/8b2bcf16590a
https://www.jianshu.com/c/86c3312ade2e
https://www.jianshu.com/c/5f351236e5ba
https://www.jianshu.com/c/67834c5dc9b9
https://www.jianshu.com/c/a0f2c5ba3c4b
https://www.jianshu.com/c/5769fdedb5db
https://www.jianshu.com/c/ea0b55005569
https://www.jianshu.com/c/daf799da97d1
https://www.jianshu.com/c/f200e40ada55
https://www.jianshu.com/c/d019414ca9c3
https://www.jianshu.com/c/e29f7b4452b3
https://www.jianshu.com/c/7843cb42896a
https://www.jianshu.com/c/1fe802942f6d
https://www.jianshu.com/c/963491502afa
https://www.jianshu.com/c/12bedd074959
https://www.jianshu.com/c/0ebba69a14c2
https://www.jianshu.com/c/4d7f2a3251d8
https://www.jianshu.com/c/cbf912fe84b5
https://www.jianshu.com/c/a69824b21db0
https://www.jianshu.com/c/97dfb7d62ee7
https://www.jianshu.com/c/690f1d951cb4
https://www.jianshu.com/c/0ab152d1f8d9
https://www.jianshu.com/c/8a2887a47f49
https://www.jianshu.com/c/752e4ea28a45
https://www.jianshu.com/c/403cceb11bde
https://www.jianshu.com/c/4f638c673417
https://www.jianshu.com/c/5757eeae7354
https://www.jianshu.com/c/b09080ed93a8
https://www.jianshu.com/c/222a9219468e
https://www.jianshu.com/c/2f9359a46573
https://www.jianshu.com/c/ad9975bb0e4c
https://www.jianshu.com/c/a8b81df237a2
https://www.jianshu.com/c/699a36a6cf04
https://www.jianshu.com/c/7d2fb0b571a2
https://www.jianshu.com/c/97a22041bc3f
https://www.jianshu.com/c/be62bad21645
https://www.jianshu.com/c/adee1d4c986a
https://www.jianshu.com/c/059560bdfaac
https://www.jianshu.com/c/2e2ca86ba8be
https://www.jianshu.com/c/38b82b049756
https://www.jianshu.com/c/ec062fa1b1e2
https://www.jianshu.com/c/d5f47da39320
https://www.jianshu.com/c/5e691429a2f3
https://www.jianshu.com/c/ee3e0a0409d7
https://www.jianshu.com/c/88f47892cc11
https://www.jianshu.com/c/713c5636d283
https://www.jianshu.com/c/a47d0e6029b9
https://www.jianshu.com/c/32a7214b040a
https://www.jianshu.com/c/be71c22608d9
https://www.jianshu.com/c/589ef8825034
https://www.jianshu.com/c/af19110d41f7
https://www.jianshu.com/c/8e5d2192e48a
https://www.jianshu.com/c/2d9598480ca7
https://www.jianshu.com/c/69c9f4967212
https://www.jianshu.com/c/171939326b02
https://www.jianshu.com/c/922e28776571
https://www.jianshu.com/c/372881514889
https://www.jianshu.com/c/17f9fb59b5ee
https://www.jianshu.com/c/064b8e77d180
https://www.jianshu.com/c/5cdde14b048c
https://www.jianshu.com/c/99a792988ad0
https://www.jianshu.com/c/8f6bf2c61005
https://www.jianshu.com/c/7f469f25481f
https://www.jianshu.com/c/8fb11b34812b
https://www.jianshu.com/c/e5c65e0656eb
https://www.jianshu.com/c/f17552c44d3c
https://www.jianshu.com/c/743369351fca
https://www.jianshu.com/c/ea49b2a4a323
https://www.jianshu.com/c/63243b2c3c2b
https://www.jianshu.com/c/d233ca00899f
https://www.jianshu.com/c/586a69e4563b
https://www.jianshu.com/c/81f50aba5e71
https://www.jianshu.com/c/d7745eda9514
https://www.jianshu.com/c/b429e71afad8
https://www.jianshu.com/c/93ea69f58e95
https://www.jianshu.com/c/5d26a7698785
https://www.jianshu.com/c/12ef564324d4
https://www.jianshu.com/c/ed1e4623000e
https://www.jianshu.com/c/9db89ba4ec40
https://www.jianshu.com/c/1f116c1cde1c
https://www.jianshu.com/c/70d67910f011
https://www.jianshu.com/c/8dbddbf0b1bd
https://www.jianshu.com/c/969447d3c949
https://www.jianshu.com/c/d2ad1bdbb21f
https://www.jianshu.com/c/f47e4f471f46
https://www.jianshu.com/c/b9a230318975
https://www.jianshu.com/c/008350088afb
https://www.jianshu.com/c/19edbd80b721
https://www.jianshu.com/c/5e7ffb26fe2e
https://www.jianshu.com/c/90ac0f1cd716
https://www.jianshu.com/c/271492570649
https://www.jianshu.com/c/56e42370bfae
https://www.jianshu.com/c/f443a99f60df
https://www.jianshu.com/c/87b9690a569f
https://www.jianshu.com/c/75c0c450cde0
https://www.jianshu.com/c/65de3356aa76
https://www.jianshu.com/c/ac50c7e7d644