<view class="box1" wx:if="{{type=='图片'}}">图片版</view>
<view class="box2" wx:if="{{type=='文字'}}">文字版</view>

<view class="button" bindtap="toggle">点击切换到{{type}}版</view>

// in js
data: {
    type: '图片'
},
toggle: function(e) {
    var that = this;
    var type = that.data.type === '图片' ? '文字' : '图片';
    that.setData({
        type: type
    });
}

Define a field xxxx in data

data: {
        xxxxx : true,
    },

View here, determine which view needs to be displayed through conditional rendering

<view wx:if="{{xxxx}}"></view>
<view wx:else></view>

Click the button to change the value of xxxx

change(){
  var value = !this.data.xxxx;
  this.setData({
    xxxx: value
  })
}

Write two pages and set a bool variable onlyText to store the status. When it is true, the text version will be displayed, and when it is false, the picture version will be displayed.
It looks like this:

<view class="box2" wx:if="{{ onlyText }}">文字版
    <button bindtap="switch">点击切换到图片版</button>
</view>
<view class="box1" wx:else>图片版
    <button bindtap="switch">点击切换到文字版</button>
</view>

var app = getApp();
Page({
    data: {onlyText: true},
    switch: function(){
        this.setData({
            onlyText: !onlyText
        })
    },
    ...
})