MENU

haian Posts

Flutter模型类

生成的模型类,支持类型检查

class FocusModel {
  List<FocusItemModel>? result;

  FocusModel({this.result});

  FocusModel.fromJson(Map<String, dynamic> json) {
    if (json['result'] != null) {
      result = <FocusItemModel>[];
      json['result'].forEach((v) {
        result!.add(new FocusItemModel.fromJson(v));
      });
    }
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    if (this.result != null) {
      data['result'] = this.result!.map((v) => v.toJson()).toList();
    }
    return data;
  }
}

class FocusItemModel {
  String? sId;
  String? title;
  String? status;
  String? pic;
  String? url;

  FocusItemModel({this.sId, this.title, this.status, this.pic, this.url});

  FocusItemModel.fromJson(Map<String, dynamic> json) {
    sId = json['_id'];
    title = json['title'];
    status = json['status'];
    pic = json['pic'];
    url = json['url'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['_id'] = this.sId;
    data['title'] = this.title;
    data['status'] = this.status;
    data['pic'] = this.pic;
    data['url'] = this.url;
    return data;
  }
}

使用

  _getFocusState() async {
    var api = 'https://...';
    var res = await Dio().get(api);
    var focusList = FocusModel.fromJson(res.data);

    setState(() {
      _focusData = focusList.result!;
    });
  }

json_to_dart 自动生成模型类

json to dart

Read More

h5与uniapp之间通过webview通信

引入

<!-- 引入 uniapp webview sdk 在body后 -->
<script src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>

网页向 APP 传值

function postMsg() {
    uni.getEnv(function (res) {
      console.log('shebei' + JSON.stringify(res))
    })
    // 向 APP 发送消息 (注意看这里 01)
    uni.postMessage({
      data: {
        name: 'head',
        age: 19,
        appfv:true
      }
    })

APP 接受传值

<template>
    <view class="content"><web-view src="http://" @message="handleMessage"></web-view></view>
</template>

<script setup>


function handleMessage(evt) {
    const [data] = evt.detail.data
}


</script>

APP 向网页传值

就是链接里加了个参数

Read More

Vue3中watch属性与watchEffect

监听基础类型

const nums = ref(9)

watch(nums, (newValue, oldValue) => {
    console.log('watch 已触发', newValue)
})

监听复杂类型

const demo = reactive({
    name: 'w',
    nickName: 'f',
    soulmate: {
        name: '',
        nickName: ''
    }
})

监听整个对象

watch(demo, (newValue, oldValue) => {
    console.log('watch 已触发', newValue)
})

自动开启{deep:true} , 所有子属性的更改都会触发监听事件

Read More

Vue项目中使用sass全局变量

安装

//安装最新版本
npm i sass-resources-loader --save-dev

//安装指定版本
npm i sass-resources-loader@2.1.1 --save-dev

配置

module.exports = {
    chainWebpack: (chain) => {
        const oneofsMap =  chain.module.rule('scss').oneOfs.store
        oneofsMap.forEach(item=>{
            item
            .use('sass-resources-loader')
            .loader('sass-resources-loader')
            .options({
              resources: './src/styles/variables.scss', 
            })
        })
    } 
}