# Pure data field

Pure data fields are some that are not used for interface rendering Data Field that can be used to improve page update performance. Mini Program base library version 2.8.2 Start supporting.

# Pure data fields in component data

In some cases, certain Data The fields in the setData Fields) are neither displayed on the interface nor passed to other components, but are only used within the current component.

At this point, you can specify such data fields as "pure data fields," and they will only be recorded in the this.data Without participating in any interface rendering process, which helps improve page update performance.

The way to specify a "pure data field" is in the Component Constructor's options Specified in the definition section pureDataPattern As a regular expression, fields whose field names match the regular expression will become pure data fields.

{% Minicode ('DKWiBXmb7jaB') %}

Code example:

Component({
  options: {
    pureDataPattern: /_/ // Specify all _ The starting data field is a pure data field
  },
  data: {
    a: true, // Ordinary data field
    _b: true, // Pure data field
  },
  methods: {
    myMethod() {
      this.data._b // Pure data fields can be found in this.data Get in
      this.setData({
        c: true, // Ordinary data field
        _d: true, // Pure data field
      })
    }
  }
})

The pure data fields in the above components will not be applied to the WXML Up:

<view wx:if="{{a}}"> This business will be displayed </view>
<view wx:if="{{_b}}"> This line will not be shown </view>

# Pure data fields in component properties

Property can also be specified as a pure data field following the pureDataPattern Of the regular expressions).

A pure data field in a property can receive an externally passed property value like a normal property, but it cannot be used directly with the component's own WXML In.

Code example:

Component({
  options: {
    pureDataPattern: /_/
  },
  properties: {
    a: Boolean,
    _b: {
      type: Boolean,
      observer() {
        // Don't do it! this observer Will never be triggered.
      }
    },
  }
})

Note: The properties of the pure data field in the properties observer Will never trigger! If you want to listen for property value changes, use the Data listener Instead.

Mini Program base library version 2.10.1 Start, it can also be done on a page or on a custom component's json Configuration in the file pureDataPattern This way, there is no need to js Document options Reconfigured in). In this case, the value should be written as a character string

{
  "pureDataPattern": "_"
}

# Listen to pure data fields with a data listener

Data listener Can be used to listen on pure data fields (as with normal data fields). In this way, you can change the interface by listening and responding to changes in pure data fields.

The following example is an example that will JavaScript A custom component that converts a timestamp to a readable time.

{% Minicode ('fcWA1Xmd7tak') %}

Code example:

Component({
  options: {
    pureDataPattern: /timestamp$/ // will timestamp Property is specified as a pure data field
  },
  properties: {
    timestamp: Number,
  },
  observers: {
    timestamp: function () {
      // timestamp Is set, it is displayed as a readable time character string
      var timeString = new Date(this.data.timestamp).toLocaleString ()
      this.setData({
        timeString: timeString
      })
    }
  }
})

<view>{{timeString}}</view>