小编mah*_*mnj的帖子

假设我有一个待办事项应用程序，当应用程序上线时，该应用程序将数据存储在 sqflite 数据库中（本地在手机上）我希望数据与我的在线数据库同步，比如 mongodb 或 firestore。我不想做完全覆盖或者每次都创建新表，我正在寻找一些只更新数据库更改的有效解决方案。

我有一个flutter web应用程序，为了访问数据库，我在secrets.dart文件中硬编码了一个APIKey ，这工作得很好。我已将此文件添加到.gitignore以防止它推送到版本控制。但是当涉及到使用 GitHub 操作部署应用程序时，脚本失败，因为它没有检测到机密文件。

我确实从 Github上查看了关于Encrypted secrets的文档，它基本上允许存储机密。但似乎这些机密只能在 yml 文件中访问。

我想知道如何在我的应用程序中使用这个秘密，以便我的脚本成功运行并部署应用程序。这是我的文件夹结构

lib/
  services/
     database.dart /// this file uses the APIkey from secrets.dart
  secrets.dart /// contains the APIkey

我能想到的解决这个问题的一种方法是使用.env文件，但我不太熟悉如何通过 CI 脚本在 .env 文件中添加密钥。我相信这也能解决我的问题。

这是我的 CI 脚本

# This file was auto-generated by the Firebase CLI
# https://github.com/firebase/firebase-tools

name: Deploy to Firebase Hosting on merge
"on":
  push:
    branches:
      - master
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-java@v1
        with:
          java-version: "12.x" …

假设我的页面上有一些滑块和开关，我更改了它们的状态并修改了它们，我知道我们这样做是setState为了显示小部件树的更改状态并重建它，但我想知道是否有办法撤消所有这些更改并返回到初始状态（应用程序最初构建时的状态）？

我试图显示与 TextField 宽度相同的覆盖层。下面的代码示例工作正常，但是当我在浏览器中运行它并调整窗口大小时，文本字段会调整大小，但覆盖层仍保持旧尺寸。

我们如何在调整窗口大小时更新（而不是重新渲染覆盖层）覆盖层的尺寸？我知道 flutter 有一个内置的 AutoComplete 小部件，但它有问题，因为截至今天我们无法在覆盖层周围添加填充。所以我正在尝试构建自己的小部件。

这是我尝试过的示例代码

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  final String title;
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> { …

当我构建项目时，出现错误：找不到模块“@fortawesome/react-fontawesome”。您的意思是将“moduleResolution”选项设置为“node”，还是将别名添加到“paths”选项？

软件包是用纱线安装的，如下所示https://fontawesome.com/docs/web/use-with/react/

在脚本中导入：

import * as React from 'react';
import Select from 'react-select';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

webpack.config.js

var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  mode: 'development',

  entry: {
    task_creator: "./src/service.tsx"
  },

  output: {
    filename: '[name].js'
  },
  resolve: {
    modules:[
      path.resolve(__dirname, 'src'),
      'node_modules',
    ],
    extensions: ['.ts', '.tsx', '.js'],
  },
  module: {
      rules: [
        {
          test: /\.tsx$/, loader: 'ts-loader'
        },
        {
          test: /\.css$/,
          use: ['style-loader', 'css-loader']
        },
        {
          test: /\.(png|woff|woff2|eot|ttf|svg)$/,
          loader: 'url-loader'
        }
      ] …

我有一个这样定义的枚举

enum PropertyType { apartment, villa, plot }
enum PossesionType { readyToMove, underConstruction }

我正在尝试创建一个通用方法，当给定字符串作为输入时，它会返回正确的枚举

class Property<T> {
 T getGenericType(String text) {
    switch (text) {
      case 'Ready to move':
        return PossesionType.readyToMove;
        break;
      case 'Apartment':
        return PropertyType.apartment;
        break;
      ....
      ....
      ....  
      default:
        return PossesionType.readyToMove;
 }   
}

我知道这会引发错误，因为它需要 T 的返回类型，要在没有泛型的情况下使其工作，我需要编写两个具有不同返回类型的不同函数，但这两个函数基本上会做相同的事情。

  PropertyType getSelectedProperty(String text) {
    switch (text) {
      case 'Apartment':
        return PropertyType.apartment;
        break;
      case 'Villa':
        return PropertyType.villa;
        break;
      case 'Plot':
        return PropertyType.plot;
        break;
      default:
        return PropertyType.apartment;
    }
  }

  PossesionType getSelectedPossession(String text) {
    switch …

我有反应功能组件MainToolBar。在导航到其他页面（功能组件）时，我需要更改 MainToolBar 的标题。我怎么能这么做呢？使用 Context API 或 Redux 或任何其他简单的东西

以下是 MainToolBar.Js 的代码

 export default function MainToolBar() {
 const classes = useStyles();
      return (
        <div className={classes.root}>
          <AppBar position="static">
             <Toolbar>
               <Typography align="center" variant="h6" className ={classes.title}>
                ERP System
               </Typography>
               <Button color="inherit">Login</Button>
             </Toolbar>
          </AppBar>
        </div>
      );
    }

以下是 Thirdparty.js 的代码

function ThirdParty() {
  return (
    <div>
      <label>ThirdParty</label>            
    </div>
 )
}

export default ThirdParty;

 ****layout.js****

import {
  BrowserRouter as ReactRouter,
  Switch as ReactSwitch,
  Route as ReactRoute,
} from "react-router-dom";

import ThirdParty from "./ThirdParty.js";
    
export default function …