小程序console.log在方法内部无法打印出data中的变量

xxx is not defined; [Component] Event Handler Error @ pages/PageTest/page_2#bound formSubmit
ReferenceError: xxx is not defined的问题。
尽管可以正常读取并显示form中信息，但是还是出现了这个错误。
这个问题充分的描述起来就是console.log(result_1)无法显示在js中定义在data中的变量。

<!--pages/PageTest/page_2.wxml-->
<text>pages/PageTest/page_2.wxml</text>
<form bindsubmit="formSubmit" bindreset="formReset">
    
      <view class="page-section">
        <view class="page-section-title">input</view>
        <view class="weui-cells weui-cells_after-title">
          <view class="weui-cell weui-cell_input">
            <view class="weui-cell__bd" style="margin: 30rpx 0" >
              <input class="weui-input" name="input" placeholder="这是一个输入框" />
            </view>
          </view>
        </view>
      </view>

      <view class="btn-area">
        <button style="margin: 30rpx 0" type="primary" formType="submit">登录</button>
        <button style="margin: 30rpx 0" formType="reset">重置</button>
      </view>
    </form>
<text>输入结果为：{{result_1}}</text>
<button type="primary" plain="true" bindtap="">忘记密码</button>

可以看到倒数第二行我写的是{{result_1}}这个变量，也是声明了的。在js中我也同样声明了这个变量。

// pages/PageTest/page_2.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    input:"",
    result_1:""
  },
  formSubmit:function(e){
    console.log('form发生了submit事件，携带数据为：', e.detail.value);
    let {input}=e.detail.value;/*这个地方里面一定要写在wxml中定义了的组件的name才能获取*/ 
    this.setData({
      result_1:input
    });
    console.log(result_1);
  },

但是表单提交后，作为测试显示结果

console.log(result_1)

就会报错，即便是将代码改成console.log(this.result_1)也只会在控制台看见一个undifined的消息。
解决办法如下：

  onLoad: function (options) {
    var that=this;
    console.log(that.data.result_1)
  },

定义一个that来访问数据，不管在那个事件或者方法中都是这样改。
不得不说js的编程习惯非常令长期后台的人觉得头大，编程习惯完全不同。