利用同时采用两种或两种以上特征波形调制的无线电载波探测目标并引爆导弹战斗部的雷达引信。

文件:590m.com/f/25127180-490365330-84b9c8(访问密码:551685)

以下内容无关:

-------------------------------------------分割线---------------------------------------------

在vue3里面,我们可以通过 reactive 来实现引用类型的响应性,那么基础类型的响应性如何来实现呢?

可能你会想到这样来实现:

const count = reactive({value: 0})
count.value += 1
这么做确实可以实现,而且也很像 ref 的使用方式,都是要 .value 嘛。那么 ref内部 是不是这么实现的呢?

我们先定义两个 ref 的实例并且打印看看。

const refCount = ref(0) // 基础类型
console.log('refCount ', refCount )const refObject = ref({ value: 0 }) // 引用类型
console.log('refObject ', refObject )

看一下结果:

基础类型的 ref

引用类型的 ref

我们都知道 reactive 是通过 ES6 的 Proxy 来实现的,基础类型的 ref 显然和 Proxy 没啥关系,而引用类型的 ref 是先把原型变成 reactive, 然后再挂到 value 上面。
这样看来,和我们的猜测不太一样呢,那么 ref 到底是如何实现的呢?我们可以看一下 ref 的源码。

ref 的源码
代码来自于 vue.global.js ,调整了一下先后顺序。

function ref(value) {
return createRef(value);
}
function createRef(rawValue, shallow = false) {
if (isRef(rawValue)) {
return rawValue;
}
return new RefImpl(rawValue, shallow);
}
class RefImpl {
constructor(_rawValue, _shallow = false) {
this._rawValue = _rawValue;
this._shallow = _shallow;
this.__v_isRef = true;
this._value = _shallow ? _rawValue : convert(_rawValue); // 深层 ref or 浅层ref
}
get value() {
track(toRaw(this), “get” /* GET /, ‘value’);
return this._value;
}
set value(newVal) {
if (hasChanged(toRaw(newVal), this._rawValue)) {
this._rawValue = newVal;
this._value = this._shallow ? newVal : convert(newVal);
trigger(toRaw(this), “set” /
SET */, ‘value’, newVal);
}
}
}
const convert = (val) => isObject(val) ? reactive(val) : val;

ref
这是我们使用的函数,里面使用 createRef 来创建一个实例。

createRef
做一些基础判断,然后进入主题,正式创建ref。这里还可以创建 shallowRef。

RefImpl
这个才是主体,显然这是 ES6 的 class,constructor 是初始化函数,依据参数创建一个实例,并且设置实例的属性。这个和上面 ref 的打印结果也是可以对应上的。
整个class的代码也是非常简单,设置几个“内部”属性,记录需要的数据,然后设置“外部”属性 value,通过setter、getter 实现对 value 的操作拦截,set 里面主要是 trigger 这个函数,由它调用模板的自动刷新的功能。

convert
很显然,判断一下参数是不是 object,如果是的话,变成 reactive 的形式。
这个就可以解释,引用类型的 ref 是如何实现响应性的,明显是先变成 reactive,然后在挂到 value 上面(挂之前判断一下是不是浅层的)。

ref 和 reactive 的关系
通过打印结果的对比以及分析源码可以发现:

基础类型的 ref 和 reactive 没有任何关系。
引用类型的 ref ,先把 object 变成 reactive ,即利用 reactive 来实现引用类型的响应性。
关系就是这样的,千万不要再混淆了。

shallowRef
浅层响应式,只监听 .value 的变化,真简单类型的响应式。

function shallowRef(value) {
return createRef(value, true); // true 浅层
}
通过源码我们可以发现,在把引用类型挂到 value 之前,先判断一下是不是浅层的,如果是浅层的,并不会变成 reactive,而是直接把原来的对象挂在 value 上面,shallowRef 和 ref 的区别就在于这一点。

我们写几个实例看看效果:

setup () {
// 浅层的测试
// 基础类型
const srefCount = shallowRef(0)
console.log('refCount ', srefCount )

// 引用类型
const srefObject = shallowRef({ value: 0 })
console.log('refObject ', srefObject )// 嵌套对象
const srefObjectMore = shallowRef({ info: {a: 'jyk'} })
console.log('shallowRef ', srefObjectMore )// reactive 的 shallowRef
const ret = reactive({name: 'jyk'})
const shallowRefRet = shallowRef(ret)
console.log('shallowRefRet ', shallowRefRet )// ==================== 事件 ==================
// 修改基础类型
const setNumber = () => {srefCount.value = new Date().valueOf()console.log('srefCount ', srefCount )
}// 修改引用类型的属性
const setObjectProp = () => {srefObject.value.value = new Date().valueOf()console.log('srefObject ', srefObject )
}// 修改引用类型的value
const setObject = () => {srefObject.value = { value: new Date().valueOf() }console.log('srefObject ', srefObject )
}// 修改嵌套引用类型的属性
const setObjectMoreProp = () => {srefObjectMore.value.info.a = new Date().valueOf()console.log('srefObjectMore ', srefObjectMore )
}// 修改嵌套引用类型的value
const setObjectMore = () => {srefObjectMore.value = { qiantao: 1234567 }console.log('srefObjectMore ', srefObjectMore )
}// 修改reactive 的浅层ref
const setObjectreactive = () => {shallowRefRet.value.name = '浅层的reactive'console.log('shallowRefRet ', shallowRefRet )
}

}
看看结果:

浅层的ref

测试了一下响应性:

基础类型 srefCount 有响应性;
引用类型 srefObject 的属性没有响应性,但是直接修改 .value 是有响应性的。
嵌套的引用类型 srefObjectMore ,属性和嵌套属性都是没有响应性的,但是直接修改 .value 是有响应性的。
reactive 套上 shallowRef ,然后修改 shallowRef.value.属性 = xxx ,也是可以响应的,所以浅层的ref 也不绝对,还要看内部结构。
triggerRef
手动执行与 shallowRef 关联的任何效果。

官网的中文版里面写的很绕,其实就是 让 shallowRef 原本不具有响应性的部分,具有响应性。
shallowRef 是浅层的,深层部分是没有响应性的,那么如果非得让这部分也具有响应性呢?
这时候可以用 triggerRef 来实现。
好吧,目前还没有想到有啥具体的应用场景,因为一般都直接简单粗暴的用 ref 或者 reactive 了,全都自带响应性。

测试了各种情况,发现 triggerRef 并不支持 shallowReactive,还以为能支持呢。(或许是我写的测试代码有问题吧,官网也没提 shallowReactive)

基于上面的例子,在适当的位置加上 triggerRef(xxx)就可以了。

setup () {
// 引用类型
const srefObject = shallowRef({ value: 0 })
// 嵌套对象
const srefObjectMore = shallowRef({ value: {a: ‘jyk’} })
// reactive 的 shallowRef
const ret = reactive({name: ‘reactive’})
const shallowRefRet = shallowRef(ret)

// 浅层的reactive
const myShallowReactive = shallowReactive({info:{name:'myShallowReactive'}})
const setsRet = () => {myShallowReactive.info.name = new Date().valueOf()triggerRef(myShallowReactive)  // 修改后使用,不支持

}

// ==================== 事件 ==================// 修改引用类型的属性
const setObjectProp = () => {srefObject.value.value = new Date().valueOf()triggerRef(srefObject) // 修改后使用
}// 修改引用类型的value
const setObject = () => {srefObject.value = { value: new Date().valueOf() }triggerRef(srefObject)

}

// 修改嵌套引用类型的属性
const setObjectMoreProp = () => {srefObjectMore.value.value.a = new Date().valueOf()triggerRef(srefObjectMore)

}

// 修改嵌套引用类型的value
const setObjectMore = () => {srefObjectMore.value.value = { value: new Date().valueOf() }triggerRef(srefObjectMore)
}// 修改reactive 的浅层ref
const setObjectreactive = () => {shallowRefRet.value.name = '浅层的reactive' + new Date().valueOf()triggerRef(shallowRefRet)
}return {srefObject, // 引用类型srefObjectMore, // 嵌套引用类型shallowRefRet, // reactive 的浅层refmyShallowReactive, // 浅层的reactivesetsRet, // 修改浅层的reactivesetObjectProp, // 修改引用类型的属性setObject, // 修改引用类型的valuesetObjectMoreProp, // 修改嵌套引用类型的属性setObjectMore, // 修改嵌套引用类型的valuesetObjectreactive // 试一试reactive的浅层ref
}

}
深层部分,不使用 triggerRef 就不会刷新模板,使用了 triggerRef 就可以刷新模板。
话说,为啥会有这个函数?

isRef
通过 __v_isRef 属性 判断是否是 ref 的实例。这个没啥好说的。
vue.global.js 源码:

function isRef® {
return Boolean(r && r.__v_isRef === true);
}
unref
使用.value的语法糖
unref 是一个语法糖,判断是不是 ref 的,如果是则取.value,不是的话取原型。
vue.global.js 源码:
function unref(ref) {
return isRef(ref) ? ref.value : ref;
}
unref 的用途
普通对象直接.属性即可使用,但是 ref 却需要.value才可以,混合使用的时候容易晕头,尤其在函数内部接收参数的时候,无法确定传入的是 reactive 还是 ref,如果每次都用 isReactive 或者 isRef 来判断类型,然后决定是否用.value,那就太麻烦了。于是有了这个语法糖。
toRef 和 toRefs
toRef 可以用来为源响应式对象上的 property 性创建一个 ref。然后可以将 ref 传递出去,从而保持对其源 property 的响应式连接。
toRefs 将响应式对象转换为普通对象,其中结果对象的每个 property 都是指向原始对象相应 property 的ref。

话说,官网的解释为啥总是这么令人费解呢?
我们还是先看看例子

setup () {
/**
* 定义 reactive
* 直接解构属性,看响应性
* 使用toRef解构,看响应性
* 使用toRefs解构,看响应性
* 按钮只修改reactive
*/
const person = reactive({
name: ‘jyk’,
age: 18
})
console.log('person ', person )

// 直接获取属性
const name = person.name
console.log('name ', name )const refName = toRef(person, 'name')
console.log('refName ', refName )const personToRefs = toRefs(person)
console.log('personToRefs ', personToRefs )const update = () => {// 修改原型person.name = new Date()
}return {person, // reactivename, // 获取属性refName, // 使用toRefpersonToRefs,update // 修改属性
}

}
当我们修改person的属性值的时候,toRef 和 toRefs 的实例也会自动变化。而直接获取的name属性并不会变化。

toRef 就是想实现直接使用对象的属性名,并且仍然享有响应性的目的。
toRef 就是对reactive 进行解构,然后仍然享有响应性的目的。

其实,说是变成了ref,但是我们看看打印结果就会发现,其实并不完全是ref。

toRef

toRefs

看类名和属性,toRef 和 ref 也是有区别的。

toRef 为啥可以响应
toRef 也是一个语法糖。

如果使用常规的方式对 reactive 进行解构的话就会发现,虽然解构成功了,但是也失去响应性(仅限于基础类型的属性,嵌套对象除外)。

那么如何实现解构后还具有响应性呢?这时候就需要使用 toRef 了。

看上面那个例子,使用 refName 的时候,相当于使用 person[‘name’],这样就具有响应性了。

复合调制引信模型(saopin.slx)相关推荐

  1. ICLR2020 | 谷歌最新研究:用“复合散度”量化模型合成泛化能力

    2020-03-11 18:13:47 据官方消息,ICLR 2020会议将取消线下会议,并于4月25日-30日线上举办虚拟会议.本届会议共有 2594篇投稿,其中 687篇论文被接收(48篇oral ...

  2. 03空间计量基础模型之SLX,SAR,SEM

    这两天刚好有些时间,于是跑了一些空间计量模型作为实战练习,使用的包是pysal,原教程点击该链接,主要是阐述了空间异质性.空间依赖的含义以及SLX,SAR,SEM这三个空间计量基本模型,其他的许多变体 ...

  3. 如何建立分类模型matlab,创建简单模型 - MATLAB Simulink - MathWorks 中国

    创建简单模型 您可以使用 Simulink® 来对系统建模,然后仿真该系统的动态行为.本教程中创建简单模型所使用的基本方法也适用于创建更复杂的模型.此示例对简化的汽车运动进行仿真.当踩下油门踏板时,汽 ...

  4. 一种基于伪标签半监督学习的小样本调制识别算法

    一种基于伪标签半监督学习的小样本调制识别算法 人工智能技术与咨询 来源:<西北工业大学学报>,作者史蕴豪等 摘 要:针对有标签样本较少条件下的通信信号调制识别问题,提出了一种基于伪标签半监 ...

  5. simulink同步发电机模型_基于Speedgoat的永磁同步电机控制Demo

    背景介绍 永磁同步电机(PMSM)相较传统电机如感应电机来说,具有转换效率高,功率密度大.控制更为简单的特点,越来越受到市场的青睐,被广泛应用于轨道交通.新能源汽车.风电等领域.为此Speedgoat ...

  6. 拓扑一致体参数化的复杂模型的等几何分析计算重用

    <Isogeometric computation reuse method for complex objects with topology-consistent volumetric pa ...

  7. 激励反向传播的自上而下注意力神经模型

    (推荐一个我自己做的普法公众号,大可说法律,有法律方面咨询的可以关注) 激励反向传播的自上而下注意力神经模型 (IJCV2018) Top-Down Neural Attention by Excit ...

  8. qpsk的映射过程_(完整版)QPSK调制原理及matlab程序实现

    QPSK 已调信号生成 一. QPSK 介绍 QPSK 是英文 Quadrature Phase Shift Keying 的缩写,意为正交相移键 控,是一种数字调制方式.其有抗干扰性强.误码性能好. ...

  9. 自动调制分类发展历程

    作为一名即将进入研究生阶段的学生,将机器学习用于自动调制分类的发展历程整理如下,供今后参考学习之用,深入了解之人大可莞尔.                           机器学习用于信号自动调制 ...

最新文章

  1. java垃圾回收system_java应用性能调优之详解System的gc垃圾回收方法
  2. ICCV 2019 论文解读 | 基于层次解析的Image Captioning
  3. 物联网在智慧仓库的价值体现
  4. 最新版本_adt-bundle-windows-x86_64-20140702 无法建立avd
  5. Java ObjectOutputStream reset()方法与示例
  6. K-means算法应用:图片压缩
  7. H5项目常见问题汇总及解决方案
  8. mac下解决中文乱码的问题
  9. 【百度地图-安卓SDK】从头开始写android程序
  10. 一文入门Python 3
  11. 2020计算机核心期刊,中国科技核心(2019–2020中文核心期刊目录)
  12. 2018中级职称计算机题库,2018年中级通信工程师传输与接入考试试题
  13. 小程序生态化,Hybrid App要崛起了?
  14. FS4054单节锂电池充电管理芯片,IC电路图
  15. 黑盒测试VS白盒测试
  16. 通俗易懂的Bootstrap视频课程(适合初学者的教程)-汤小洋-专题视频课程
  17. 野火指南者ESP8266模块学习
  18. 中文 Uncode 编码范围
  19. lua fadeOut
  20. 现在的传奇游戏 哪个是真的传奇,真假传奇应该怎么区分?

热门文章

  1. STM32F4中的CCM内存说明与使用
  2. 电路结构原理_零基础学电工之常用电气符号和举例认识电路图
  3. 【Python】元组之不可修改性详解
  4. 华为云计算之华为私有云初识
  5. mysql怎么避免缩表_如何避免MySQL死锁(二)
  6. 支付宝技术专家李战斌:安防视频行为分析系统的技术演进及应用场景 | 2018FMI人工智能与大数据高峰论坛(深圳站)
  7. android新闻app
  8. js习题(求两个数的和的四种方法)
  9. QT + FFmpeg 5.x + x264 + x265 + SDL2 音视频播放器
  10. Hexo结合Stun静态博客搭建从入门到入土