title: Element UI - Change text of loading
body: <p>I'm using <code>element-ui</code> and the <code>Loading</code> service.</p>
  
  <p>I would like to be able to dynamically change the text when loading</p>
  
  <h3>Expected result</h3>
  
  <p>The text should be directly changed to <code>yyyy</code></p>
  
  <h3>Actual result</h3>
  
  <p>The text is <code>load</code> and stays <code>load</code></p>
  
  <h3>Question</h3>
  
  <p>How can I dynamically change the loading text after 1sec</p>
  
  <p><a href="https://jsfiddle.net/zxjbxg7x/" rel="nofollow noreferrer">https://jsfiddle.net/zxjbxg7x/</a></p>
  
  <pre><code>var Main = {
  data() {
    return {
      text: 'load'
    }
  },
  methods: {
    openFullScreen2() {
      const loading = this.$loading({
        lock: true,
        text: this.text,
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      this.text = 'yyy';
      setTimeout(() =&gt; {
        loading.close();
      }, 5000);
    }
  }
  </code></pre>
  
  <p>}</p>