反應本機openai jsx

反應本機 openai-jsx

⚛️？ ？使用 OpenAI 產生功能性的React Native元件！看看它的實際效果！ ？

只需提供一些有關您希望看到的內容的高級描述，就可以使用react-native-openai-jsx來創建真實的、工作的React Native應用程式。

例如：

); }">

 import { Alert } from 'react-native' ;
import { Prompt } from 'react-native-openai-jsx' ;

export default function App ( ) : JSX . Element {
  return (
    < Prompt
      extraProps = { React . useMemo ( ( ) => ( {
        onPress : ( message : string ) => Alert . alert ( message ) ,
      } ) , [ ] ) }
      prompt = { [
        'Provide a complete example of a React Native View component which contains a big Button in the center with the text "Press Me".' ,
        'When the Button is pressed, it must call a function prop passed into the component called onPress with the parameter "Hello from OpenAI!".' ,
      ] . join ( ' ' ) }
    / >
  ) ;
}

這看起來可能很瘋狂，但這確實有效！透過使用openai客戶端程式庫，我們可以使用他們複雜的機器學習模型來為我們想像功能性的 React Native 應用程式。在運行時，我們可以使用@babel/runtime將自動生成的模組轉譯為運行時友好的 JavaScript，並使其在react-native-wormhole之上執行。

入門

首先，您需要安裝react-native-openai-jsx和react-native-url-polyfill ：

yarn add react-native-openai-jsx react-native-url-polyfill

下載時，您需要為 OpenAI 建立一個客戶端 API 金鑰（如果您還沒有）。您可以在此處找到有關如何執行此操作的說明。

注意：您需要react-native-url-polyfill才能與官方openai SDK相容。

接下來，在應用程式的根目錄將polyfills匯入到應用程式的入口點，即：

 + import 'react-native-url-polyfill/auto';

import { AppRegistry } from 'react-native';
import App from './src/App';
import { name as appName } from './app.json';

AppRegistry.registerComponent(appName, () => App);

這應該就是一切了吧！

要看到這一切結合在一起，您可以免費嘗試example應用程式：

" yarn (ios|android|web)">

 cd example/
OPENAI_API_KEY="" yarn (ios|android|web)

？配置

元件公開了所有介面功能，以開始建立和自訂您自己的語言模型提示。

姓名	類型	描述	預設值
prompt	string?	用於向機器學習模型建議建立什麼應用程式的文字字串。	旨在評估為空React.Fragment的條件。
completionSettings	CompletionSettings	CreateCompletionRequest物件。	必需的
style	StyleProp?		undefined
debug	boolean?	用於渲染轉譯期間的錯誤並預覽 OpenGPT 產生的回應。	false
extraProps		可用於傳遞到 OpenGPT 的自訂物件。例如，您可以傳遞回調函數並指示機器學習模型它作為可能的 prop 存在。	{}
Wormhole	React.FC	一個Wormhole 。這可用於包括對其他程式庫的支持，例如react-native-svg 。	DefaultWormhole

請不要忘記，為了使該庫取得任何成功，您必須在提示中告知機器學習模型您正在嘗試建立 React Native 應用程式。

✌️ 許可證

麻省理工學院