Tutoriel : Partager des données et des événements entre des fonctions personnalisées Excel et le volet Office

Utilisez un runtime partagé pour partager des données globales entre les fonctions personnalisées de votre complément Excel et le volet Office. Dans ce tutoriel, vous ajoutez des fonctions et des contrôles du volet Office qui lisent et mettent à jour la même variable.

Configuration requise

Suivez le didacticiel fonctions personnalisées Excel et utilisez le complément que vous avez créé. Le projet doit utiliser les fonctions personnalisées Excel à l’aide d’un type de projet Runtime partagé et d’un type de script JavaScript .

Partager l’état entre une fonction personnalisée et du code du volet Office

Créer des fonctions personnalisées pour obtenir ou stocker l’état partagé

  1. Dans Visual Studio Code, ouvrez src/functions/functions.js.

  2. Au début du fichier, ajoutez le code suivant. Ce code initialise une variable globale nommée sharedState.

    window.sharedState = "empty";
    
  3. Ajoutez le code suivant pour créer une fonction personnalisée qui stocke des valeurs dans sharedState.

    /**
     * Saves a string value to shared state with the task pane
     * @customfunction STOREVALUE
     * @param {string} value String to write to shared state with task pane.
     * @return {string} A success value
     */
    function storeValue(sharedValue) {
      window.sharedState = sharedValue;
      return "value stored";
    }
    
  4. Ajoutez le code suivant pour créer une fonction personnalisée qui obtient la valeur actuelle de sharedState.

    /**
     * Gets a string value from shared state with the task pane
     * @customfunction GETVALUE
     * @returns {string} String value of the shared state with task pane.
     */
    function getValue() {
      return window.sharedState;
    }
    
  5. Enregistrez le fichier.

Créer des contrôles du volet Office pour utiliser des données globales

  1. Ouvrez src/taskpane/taskpane.html.

  2. Après l’élément fermant </main> , ajoutez le code HTML suivant pour créer des contrôles qui stockent et récupèrent des données globales.

    <ol>
      <li>
        Enter a value to send to the custom function and select
        <strong>Store</strong>.
      </li>
      <li>
        Enter <strong>=CONTOSO.GETVALUE()</strong> into a cell to retrieve it.
      </li>
      <li>
        To send data to the task pane, in a cell, enter
        <strong>=CONTOSO.STOREVALUE("new value")</strong>
      </li>
      <li>Select <strong>Get</strong> to display the value in the task pane.</li>
    </ol>
    
    <p>Store new value to shared state</p>
    <div>
      <input type="text" id="storeBox" />
      <button onclick="storeSharedValue()">Store</button>
    </div>
    
    <p>Get shared state value</p>
    <div>
      <input type="text" id="getBox" />
      <button onclick="getSharedValue()">Get</button>
    </div>
    
  3. Avant l’élément fermant </body> , ajoutez le script suivant pour gérer les événements des boutons Store et Get .

    <script>
      function storeSharedValue() {
        let sharedValue = document.getElementById('storeBox').value;
        window.sharedState = sharedValue;
      }
    
      function getSharedValue() {
        document.getElementById('getBox').value = window.sharedState;
      }
    </script>
    
  4. Enregistrez le fichier.

  5. Créez le projet.

npm run build

Essayer de partager des données entre les fonctions personnalisées et le volet Office

  1. Démarrez le projet.
npm run start
  1. Dans le volet Office, entrez une valeur, puis sélectionnez Stocker.
  2. Dans une cellule Excel, entrez =CONTOSO.GETVALUE() pour récupérer la même valeur.
  3. Dans une autre cellule, entrez =CONTOSO.STOREVALUE("new value") pour mettre à jour la valeur partagée.
  4. Dans le volet Office, sélectionnez Obtenir pour afficher la valeur mise à jour.

Remarque

Un runtime partagé permet également aux fonctions personnalisées d’appeler certaines API Office. Pour plus d’informations, consultez Appeler des API Microsoft Excel à partir d’une fonction personnalisée.

Lorsque vous êtes prêt à arrêter le serveur de développement et à désinstaller le complément, exécutez la commande suivante.

npm run stop

Voir aussi