訪問功能，以利用在發送功能的Outlook插件

我嘗試使用On send feature for Outlook add-ins反應的應用程序。我的應用程序是使用webpack構建的反應應用程序。在插件清單中，我需要指定將在項目send上調用的文件和函數名稱。訪問功能，以利用在發送功能的Outlook插件

我定義的方法如下：

export function validateBody(params: any): void { 
    console.log("Validate called"); 
    console.log(params); 
    params.completed({ allowEvent: false }); 
}

什麼都輸出爲以下幾點：

/***/ 181: 
/***/ (function (module, __webpack_exports__, __webpack_require__) { 

     "use strict"; 
     Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); 
     /* harmony export (immutable) */ __webpack_exports__["validateBody"] = validateBody; 
     // import * as React from 'react'; 
     // import * as ReactDOM from 'react-dom'; 
     // import Test from '../Test'; 
     // import './index.css'; 
     //import './../function.ts' 
     // ReactDOM.render(
     // <Test text="index" />, 
     // document.getElementById('root') as HTMLElement 
     //); 
     function validateBody(params) { 
     // console.log('Validationg Body'); 
     console.log("Validate called"); 
     console.log(params); 
     params.completed({ allowEvent: false }); 
     } 


     /***/

如何具備的功能名稱在清單中定義調用此方法。
或者我該如何定義函數，以便將其插入到函數之外，以便可以直接調用函數。

來源

2017-08-16 lokimidgard

我已經找到了解決辦法，但我不喜歡它。所以我被替換成了替代品。

我創建了採取HTML元素的道具和assigne的功能在此元素的渲染成分：

class FunctionHelper extends React.Component<{ dom: HTMLElement }, {}> { 

    constructor() { 
     super(); 
    } 

    render() { 
     (this.props.dom as any).validateFunction = this.TestEvaluation; 
     console.log('Render App'); 
     return (
      <div className="App"> 
       <div className="App-header"> 
        <img src={logo} className="App-logo" alt="logo" /> 
        <h2>Welcome to React</h2> 
       </div> 
       <p className="App-intro"> 
        To get started, edit <code>src/App.tsx</code> and save to reload. 
       </p> 
      </div> 
     ); 
    } 

    TestEvaluation(params: any): void { 
     // console.log('Validationg Body'); 
     console.log("Validate called"); 
     console.log(params); 
     params.completed({ allowEvent: false }); 
    } 
}

這將呈現如下：

ReactDOM.render(
    <FunctionHelper dom={document.getElementById('root') as HTMLElement} />, 
    document.getElementById('root') as HTMLElement 
);

而且作爲模板我用以下html文件來調用dom元素的功能：

<!doctype html> 
<html lang="en" dir="ltr"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico"> 
    <!-- Office JavaScript API --> 
    <script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.debug.js"></script> 
    <title>React App</title> 
</head> 
<body> 
    <div id="root"></div> 
    <script> 
    function validateMail(params) { 
     console.log('Calling Function Validate') 
     let element = document.getElementById('root'); 
     element.validateFunction(params); 
    } 
    </script> 
</body> 
</html>

然後我可以把它e validateMail功能。

來源

2017-08-16 13:19:13 lokimidgard

不幸的是，UILess框架需要加載一個函數文件在標題的腳本代碼的HTML頁面。在使用webpack的時候解決這個問題的一種方法是爲函數文件javascript創建一個定製的webpack加載器，UILess HTML函數文件可以像webpack像CDN一樣提供文件來檢索它。該裝載機將需要像一個文件加載一個獨立的裝載機： https://webpack.js.org/loaders/file-loader/

來源

2017-08-16 21:01:48

訪問功能，以利用在發送功能的Outlook插件

回答

相關問題