vue(emit)、node(promise、 promise封装文件读取)

emit

<!-- 【$emit】

子里如何给父组件传递数据?

利用发通知的形式来间接传数据。

发通知的语法:this.$emit('自定义的事件名'数据)


 

父里要订阅这个通知(相当于监听这个事件)

<子组件 @自定义的事件名="函数">


 

当子的$emit执行时,就会自动调用父里绑定的函数,函数的参数就是子传递过来的数据。

例:

子里的代码

<button aclick="$emit('sb','hello')">点击后,要给父传递数据</button>

解释:当子组件里面点了这个按钮,就会触发一个叫sb的事件,那个父组件如果监听了sb就会调用。

父里的代码

<子组件 @sb="函数"/>

当sb事件通知时,就会调用上面的函数,函数的参数就是永不过时。 -

 stuEmit.vue

<template>
    <div class="son">
    <button @click="fn1"> 点击这个按钮,子组件的值传递给父组件</button>
    </div>
    </template>

    <script>
    export default {
    methods:{
    fn1(){
    //给父组件传递值
    // this.$emit('自定义事件名',传递的数据)
     this.$emit('sb','hello')
    }
}
    }
    </script>

    <style>
    .son {
     width: 500px;
     height:500px;
     border: 1px solid gold;
    }
    
    </style>

 promise

// 导入fs filesystem 文件管理器

const fs = require('fs')


 

// 构建promise对象

 const ps = new Promise((resolve, reject) => {

    // 调用fs模块中的文件

    fs.readFile('./1.txt', (err, data) => {

        // 读取成功状态下

        if (!err) {

            //   调用resolve方法并传入读取到的内容

            resolve(data)

        } else {

            // 读取失败调用reject方法并传入错误信息

            reject(err)

        }

    })

})

// promise还可以调用两个方法

ps.then( res => {

    console.log('then调用了' + res);

})

.catch( err => {

    console.log('catch调用' + err);

})

作业

console.log(1);

new Promise((resolve,reject) => {

    console.log(2);

    setTimeout(() => {

        console.log(6);

        // 产生一个0到10的随机数

        let num = Math.floor(Math.random() * 11)

        // 如果大于等于5就resolve

        if(num >= 5){

            resolve()

        } else {

            // 否则就reject

            reject()

        }

    },1000);

    console.log(3);

})

.then(res => {

    console.log(4);

})

.catch(err => {

    console.log(7);

})

promise封装文件读取

fs.js

//导入fs模块

const fs = require('fs')

//构建一个读取文件的函数
function readFile(path){

    //构建的promise对象,将异步代码同步化
    return new Promise((resolve,reject) => {

        //异步代码读取文件
        fs.readFile(path,(err,data) => {
            //读取成功
            if(!err) {

                resolve(data)

            }else{

                reject(err)

            }
        })
    })

}

readFile('./1.txt')
.then(res => {
    console.log('读取到的结果是'+ res);
})
.catch(err => {
    console.log(err);
})
readFile('./2.txt')
.then(res => {
    console.log('读取到的结果是' + res);
})

//完成了写入文件时函数的封装
function writeFile(path,content){

    return new Promise ((resolve,reject) => {

        fs.writeFile(path,content,err =>{

            if(!err){
                resolve()
            }
            else{
                reject(err)
            }
        })
    })
    
}
writeFile('./1.txt','小黑邹')
.then(res => {
    console.log(res);
})
.catch (err => {
    console.log(err);
})
writeFile('./2.txt','1234')




 index.js

// 大部分涉及异步操作的库、模块,都提供了基于promise的封装版本
//fs模块也有promise版

const fs = require('fs/promises')

fs.readFile('./1.txt')
.then (data => {

// console.log(data);
console.log(data.toString());

})
.catch (err => {

console.log(err);
})
fs.writeFile('./2.txt','我是2新写入的内容')
.then(()=> {

console.log('写入成功');})

.catch( err => {
console.log(err);
})

猜你喜欢

转载自blog.csdn.net/m0_73495603/article/details/127947794